Onclick su elementi creati con script non funziona
Salve ragazzi chiedo scusa per la domanda davvero stupida.
Tramite una pagina php creo degli elementi span di html.
Allora tramite JavaScript ho assegnato a questi elementi l'evento onclick e stampato qualcosa e funziona tutto.
Per pura curiosità ho voluto provare Jquery ma non mi funziona, il click non è riconosciuto!
Parte che stampa gli elementi span
Codice PHP:
...
$hint = "<br><span> $name </span>";
...
echo $hint;
Pagina html dove non funziona il codice:
Codice PHP:
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$( "span" ).click(function() {
alert( "Handler for .click() called." );
});
});
</script>
<script>
function showHint(str) {
if (str.length == 0) {
document.getElementById("txtHint").innerHTML = "";
document.getElementById("txtHint").style.border="0px";
return;
} else {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("txtHint").innerHTML = this.responseText;
document.getElementById("txtHint").style.border="1px solid #A5ACB2";
document.getElementById("txtHint").style.width="240px";
}
};
xmlhttp.open("GET", "getRicerca.php?q=" + str, true);
xmlhttp.send();
}
}
/*function prova(testo) {
document.getElementById("ricerca").value = testo;
document.getElementById("txtHint").innerHTML = "";
document.getElementById("txtHint").style.border="0px";
} */
</script>
</head>
<body>
<p><b>Start typing a name in the input field below:</b></p>
<form>
First name:<br>
<input type="text" id="ricerca" size="30" onkeyup="showHint(this.value)">
<input type="button" value="Conferma">
<div id="txtHint"></div>
</form>
</body>
</html>
Praticamente c'è una chiamata Ajax e in base alla lettera che scrivo escono dei suggerimenti (appunto gli elementi span).
Nei commenti vedete il codice JavaScript che invece funziona! (in tal caso negli script php c'era scritto <br><span onclick='prova(this.innerHTML)'> $name </span>
Ho provato a cambiare span con p.
Ho provato a togliere il document.ready e lasciare solamente il click ma nulla.
Jquery funziona perchè se faccio alert("ciao") al document ready me lo stampa.
Ho provato pure a creare un paragrafo, dargli un id e provare a stampare qualcosa all'evento click ma nulla.
Il problema è come se non vedesse gli span, ma comunque quando li stampo con lo script php è come se fossero in quella pagina!
Ho tentato anche di separare i tag script (come ho lasciato per ora).
Ora sono troppo curioso di capire il problema, vi ringrazio!