Hace varios meses, tras muchas semanas de trabajo conseguí hacer un scroll infinito que va cargando otra página llamada articulo.php cuando se llega al final de la página. El problema está en que en la página que carga (articulo.php) hay un botón que tiene un id que depende de una base de datos (es una variable que se obtiene con un SELECT). Después, hay un script que cuando pulsas dicho botón te envía a otra página. El problema está en que cuando le pulsas es como si el botón no existiera, porque no se activa. No sé porqué puede ser, ni que es ni qué hacer para arreglarlo. Si alguien supiera el problema, como solucionarlo, otra forma en hacer un scroll infinito, algún consejo lo agradecería. Muchisímas gracias a todos por vuestro tiempo.
El código del scroll infinito es el siguiente:
<script>
function ajax(){
const http = new XMLHttpRequest();
const url = 'http://localhost/Registro/articulo.php';
http.onreadystatechange = function(){
if(this.readyState == 4 && this.status == 200){
console.log(this.responseText);
document.getElementById("response").innerHTML += this.responseText;
}
}
http.open("GET", url);
http.send();
}
$(document).ready(function(){
$(document).scroll(function(){
if($(document).scrollTop()+$(window).height()>=$(document).height())
{
$("body").append( ajax(),ajax(),ajax());
}
});
});
</script>
El código del botón es el siguiente:
<?php $sql="SELECT*FROM publicaciones WHERE grupo = '".$grupo2."' ORDER BY RAND() limit 1";
$result=mysqli_query($conn,$sql);
while($mostrar=mysqli_fetch_array($result)){
$publicacion=$mostrar['publicacion'];
$imagen = $mostrar['imagen'];
$idpublicacion = $mostrar['Numero'];
?>
<?php } ?>
<hgroup>
<div id="user"><button id="<?= $idpublicacion ?>" class="boton_autor"><img src="Imagenes/Foto de perfil - copia.png" id="fotouser">
<h1 id="nombreuser">
<?php $sql="SELECT*FROM publicaciones WHERE publicacion= '".$publicacion."' ORDER BY RAND() limit 1";
$result=mysqli_query($conn, $sql);
while($mostrar=mysqli_fetch_array($result)){
$autor= ucfirst($mostrar['nombre']);?>
<div id="<?= $idpublicacion ?>autor"><?php echo $autor;?></div>
<?php } ?>
</h1></button>
</div>
Y el script que activa el botón que también está en esta página llamada articulo.php es:
<script>
var boton_autor<?= $idpublicacion ?> = document.getElementById('<?= $idpublicacion ?>');
var autorperfil<?= $idpublicacion ?> = document.getElementById('<?= $idpublicacion ?>autor').textContent;
boton_autor<?= $idpublicacion ?>.addEventListener('click', () => {
window.location.href = 'Perfilotros.php?autor=' + autorperfil<?= $idpublicacion ?>;
});
</script>