2012-03-20 14 views
6

Qualcuno sarebbe in grado di aiutare qui?jQuery/AJAX - Carica il contenuto in un div quando si fa clic sul pulsante?

Vorrei compilare un div e.g.

<div id="contenthere"></div> 

con contenuto da un file esterno, ad es.

/includes/about-info.html 

quando si fa clic su un pulsante con una determinata classe, ad es.

<p class="classloader">Click Here</p> 

Qualcuno ha un esempio di codice rapido che può mostrarmi per raggiungere questo obiettivo?

+0

http://api.jquery.com/load / – Blazemonger

risposta

13

Usa jQuery.click e jQuery.load:

$(document).ready(function(){ 
    $('.classloader.').click(function(){ 
     $('#contenthere').load('/includes/about-info.html'); 
    }); 
}) 
2

Si potrebbe sottoscrivere l'.click() evento del paragrafo e quindi utilizzare la funzione .load() per inviare una richiesta AJAX per l'URL dato e iniettare i risultati nel selettore specificato:

$(function() { 
    $('.classloader').click(function() { 
     $('#contenthere').load('/includes/about-info.html'); 
     return false; 
    }); 
}); 
0

Provare quanto segue:

var myurl = 'myfileonthesamedomain.html'; 

$('button').click(function(){ 
    $('div.loadme').load(myurl); 
}); 
2

carico ultima versione di jQuery:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> 

jQuery codice:

<script language="javascript"> 
$(function(){ 
    $(".classloader").click(function(){ 
    $("#contenthere").load("/includes/about-info.html"); 
    }); 
}); 
</script> 
</script> 

codice HTML:

<p class="classloader">Click Here</p> 
<div id="contenthere"></div> 
Problemi correlati