Ciao NLSweb,
Allora ho fatto la modifica da te suggeritami ho messo così:
Codice PHP:
<script>
$(document).ready(function(){
/* definiamo quanti campi input sono presenti */
var numeroCampiinput = 3;
/* nascondiamo le immagini di controllo */
for(i=1;i<=numeroCampiinput;i++){
var elemento = "#controllo"+i;
$(elemento).hide();
}
/* assegnamo la funzione controllo al cambiamento dei campi input */
function ccc(i){
return function(){
controlla(i);
};
}
for(i=1;i<=numeroCampiinput;i++){
var elemento = "#input"+i;
$(elemento).change(ccc(i));
}
});
/* funzione di controllo: argomento di funzione ID del campo input */
/* identifichiamo l'elemento del campo input e leggiamo il suo valore */
/* quindi chiamiamo la funzione AJAX passandogli ID e Valore del campo */
function controlla(id){
var elemento = "#input"+id;
var valore = $(elemento).val();
loadXMLDoc(id,valore);
}
/* funzione AJAX: argomenti di funzione ID e Valore del campo Input */
function loadXMLDoc(id,valore)
{
var xmlhttp;
if (window.XMLHttpRequest)
{
xmlhttp=new XMLHttpRequest();
}
else
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
/* qui prendiamo la risposta del file PHP */
/* controlliamo se sia Vero o Falso la presenza del dato del DB */
/* quindi visualizziamo l'immagine relativa */
var risposta = xmlhttp.responseText;
risposta = risposta.substr(1, risposta.length-2);
var elementoIMG = "#controllo"+id+" img";
alert(risposta );
if (risposta=="VERO"){
$(elementoIMG).attr("src","available.png");
}else{
$(elementoIMG).attr("src","not-available.png");
}
var elemento = "#controllo"+id;
$(elemento).show();
}
}
/* eseguiamo il file PHP per verificare se il dato e' presente nel DB */
/* passiamo al file PHP id e il valore del campo Input */
xmlhttp.open("GET","checkdati.php?ID="+id+"&VAL="+valore,true);
xmlhttp.send();
}
</script>
</head>
<body>
</head>
<body>
<header>
<div id="Titolo"><h2>Prova inserimento campi</h2></div>
<hr>
</header>
<footer>
<div id="footer">
La pagina è stata creata by Fabio xxxxxxxxxx. Tutti i diritti riservati.
Ogni parte o contenuto di essa se ricopiati o riportati in altre pagine
senza previaviso e autorizzazione dell'autore, saranno puniti a norma di legge.
</div>
</footer>
<div id = "div">
Cognome: <input type ="text" id="input1" name="cognome" maxlenght ="15" >
<div id="controllo1"><img src="" /></div>
<p> <p>
Nome: <input type ="text" id="input2" name="nome" maxlenght ="15" >
<div id="controllo2"><img src="" /></div> </p></p>
<p> <p>
userName: <input type ="text" id="input3" name="username" maxlenght ="15" >
<div id="controllo3"><img src="" /></div> </p></p>
</div> </div>
<?php
include_once("connettimysqli.php");
include_once("data.php");
?>
</body>
</html>
E il risultato è il seguente:
http://s14.postimg.org/86h653vpt/Risposta_alert.png
Spero di averla posizionata giusta.