Aclarar que es la primera vez que toco AJAX o JS, nunca lo he usado, siempre lo he hecho todo de forma "plana" si quieres nueva informacion, actualiza la pagina.
Al cargar HTML mediante AJAX no me funciona el javascript que usa ese HTML, me refiero a que cargo una lista de imágenes de la base de datos y al pasar el ratón por encima se debería de oscurecer y mostrar el nombre de la imagen, pero si lo hago mediante AJAX no funciona, es como si no cargara los JS.
Os dejo el código a ver si me podéis ayudar.
En el index.PHP
Código HTML:
<script>
function showUser(str) {
if (str == "") {
document.getElementById("txtHint").innerHTML = "";
return;
} else {
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","scripts/ajaxmysqlhome.php?q="+str,true);
xmlhttp.send();
}
}
</script>
<form>
<select name="users" onchange="showUser(this.value)">
<option value="">Select:</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</form>
<br>
<div id="txtHint"><b>here...</b></div><br>
En
scripts/ajaxmysqlhome.php
Simplemente un GET, y segun el valor del numero busca una cosa u otra en la base de datos, después hago un WHILE y muestro los siguientes resultados con echo
Código HTML:
<article class="border c-two" style="background-image:url(<?php echo $header; ?>); background-size: 314px 157px;">
<div style="opacity: 0;" class="fdw-background">
<h4><a href="<?php echo "/item/".$id."/".$clean; ?>" style="color:#fff;"><?php echo $name; ?></a></h4>
<br>
<div class="fdw-subtitle a-center"> <a href="<?php echo "/item/".$id."/".$clean; ?>"><?php echo $rsss; ?></a></div>
<br>
<center> <p><a class="btn btn-info btn-xs" href="<?php echo "/item/".$id."/".$clean; ?>" role="button">Test </a></p></center>
</div>
</article>
Entonces ese codigo de arriba aparece en el INDEX.PHP, pero no funciona lo de pasar el raton y mostrar nombre y boton.
Cuando paso el ratón debería de aparecer esto, pero repito, si llamo el HTML por AJAX no funciona.