JS ne fonctionne plus après .load()
Bonjour,
J'utilise setInterval et .load() pour rafraîchir une sorte de flux de conversations.
Cependant, à l'affichage des conversations, j'utilise .toggle() sur un bouton "Répondre" pour faire dérouler/masquer un textarea et un submit.
Mon setInterval est configuré à 3 secs. Lors de l'affichage de la page, le toggle() fonctionne, mais après 3 secs, le toggle() ne fonctionne plus, étant donné que j'appel la même page avec un selector.
Voici mon code (l'affichage est simplifié):
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34
|
<div id="the_river_loading">
<?php
$sql = 'SELECT firstname, lastname, text
FROM users';
$result = mysqli_query($mysqli, $sql);
while ($data = mysqli_fetch_assoc($result))
{
echo '<div class="conversations">
$firstname . ' ' . $lastname . '<br />' . $text . '<br /><br />
<div class="btnAnswer_news">Répondre</div>
<form method="post" action="" style="display: none;">
<textarea name="answer_text"></textarea><br />
<input type="submit" name="answer_valid_id_' . $count . '" value="Poster" />
</form>
</div>';
}
?>
</div>
<script type="text/javascript">
$(".btnAnswer_news").click(function(){
$(this).next().toggle("fast");
});
var auto_refresh = setInterval(
function() {
$("#the_river_loading").fadeOut("slow").load("/home" + " #the_river_loading").fadeIn("slow");
}, 3000
);
</script> |
Comment faire pour que le toggle fonctionne lui aussi après le .load() ? Pourquoi cela ne fonctionne pas actuellement ?
Au plaisir de vous lire.
Edit: Je viens de mettre la fonction du toggle() dans le callback de .load(), et ça fonctionne. Cependant si je déroule le toggle, 3 secs après sachant que le div est rechargé, le toggle remonte. Comment faire pour qu'il ne remonte pas ?
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13
| <script type="text/javascript">
$(".btnAnswer_news").click(function(){
$(this).next().toggle("fast");
});
var auto_refresh = setInterval(
function() {
$("#the_river_loading").load("/home" + " #the_river_loading", function() {
$(".btnAnswer_news").click(function(){
$(this).next().toggle("fast");
});
});
}, 3000); |