Add on click event to p Elemente jQuery

Question

Ich versuche, ein onclick-Ereignis zu jedem der p-Elemente erstellt. Ich muss dies innerhalb der for-Schleife tun, so dass der Rest der Informationen in der "Daten" -Array auf das angeklickte Ergebnis bezieht.

Es ist eine Autocomplete-Suchfunktion, die einen Kontakt nachschlägt und den Namen und den Firmennamen in einem Dropdown-Feld anzeigt. Wenn Sie darauf klicken, werden die entsprechenden Felder mit den anderen Informationen wie E-Mail-Adresse und Telefonnummer ausgefüllt.

Wie würde ich ein onclick-Ereignis zu jedem p-Element innerhalb der for-Schleife hinzufügen?

//Instant Search for Key Contact lookups 
 
$(document).ready(function(){ 
 
    $('#search_customer').on("keyup input", function(){ 
 
     /* Get input value on change */ 
 
     var term = $(this).val(); 
 
     var resultDropdown = $("#result"); 
 
     var i = 0; 
 
     var results = ''; 
 
     if(term.length){ 
 
      $.get("/profile/includes/custom/340/livesearch.php", {query: term}).done(function(data){ 
 
       // Display the returned data in browser 
 
       data = jQuery.parseJSON(data); 
 
       for (i = 0; i < data.length; i++) { 
 
       results += '<p>' + data[i][0] + ' ' + data[i][1] + ' | <span>' + data[i][2] + '</span></p>'; 
 
       } 
 
       resultDropdown.html(results); 
 
      }); 
 
     } else{ 
 
      resultDropdown.empty(); 
 
     } 
 
    }); 
 
});

Ich würde die Funktion von jedem wollen Onclick, so etwas zu sein:

p.on("click", function(){ 
 
     $("#search_customer").val(data[i][0] + ' ' + data[i][1]); 
 
     $("#customer_email").val(data[i][[5]); 
 
     $("#customer_company").val(data[i][6]); 
 
    });

Answer 1

Sie eine Klasse zu Ihrem p Element hinzufügen und Machen Sie dann einen Event-Handler für den Klick dieser Klasse.

So auf dieser Linie:

results += '<p>' + data[i][0] + ' ' + data[i][1] + ' | <span>' + data[i][2] + '</span></p>'; 

eine Klasse hinzufügen:

results += '<p class="placeholderClassname">' + data[i][0] + ' ' + data[i][1] + ' | <span>' + data[i][2] + '</span></p>'; 

und dann JQuery-Handler:

$(".placeholderClassname").on("click", function() { 
    //Write code here 
    alert($(this).text()); 
}); 

Sie können auch Ihre Jquery-Handler auf allen p Elemente, die aber Probleme verursachen können, wenn Sie andere p Elemente in Ihrer Seite haben.

Mehr Informationen über die JQuery-Ereignishandler: http://api.jquery.com/on/