.load（）小部分沒有切換

Question

我有一個每隔3秒刷新一次jQuery的.load（）的會話流。

這個系統工作，但在每個對話中，我有一個答案按鈕誰滑動表單（textarea和提交按鈕）與.toggle（）。

爲了顯示流程，我用了一段時間的PHP。

我的問題是，當通過.load（）加載並單擊答案按鈕時，窗體再次隱藏並且文本也包含。

<div id="the_river_loading"> 
<?php 
$sql_the_river = 'SELECT u.nickname, u.firstname, u.lastname, u.main_photo, u.locality, 
      id_conversation, id_messages, owner, participants, text, date 
      FROM users AS u 
      INNER JOIN the_river 
      ON u.nickname = owner 
      WHERE answer = 0 
      ORDER BY date DESC'; 
$result_the_river = mysqli_query($mysqli, $sql_the_river); 

$count = 0; 
while ($data_the_river = mysqli_fetch_assoc($result_the_river)) 
{ 
    $count++; 
    echo '<div class="message_container_news">'; // Start block conversation 

    echo '<a href="/profile/' . $nickname . '" class="name_links" style="vertical-align: top; font-size: 16px;"> 
    <img src="' . $main_photo . '" title="' . $name . '" class="members_actu_photo" />' . $name . '</a> 
    <span style="vertical-align: top">, ' . $locality . '</span><span style="float: right; font-size: 12px;">Posté le Octobre 25, 2012</span> 
    <p style="margin-top: 5px;">' . $data_the_river['text'] . '</p> 
    <div class="btnAnswer_nb">' . $count_answer . '</div> Answers 
    <a href="/news/' . $data_the_river['id_conversation'] . '" style="margin-left: 100px; display: inline;" class="global_links">See conversation</a> 

    <div class="btnAnswer_news" id="btnAnswer_news_id_' . $count . '">Reply</div> 
    <form method="post" id="display_form_id_' . $count . '" action="" style="display: none;"> 
     <br /> 
     <textarea name="answer_text"></textarea><br /> 
     <input type="submit" name="answer_valid_id_' . $count . '" value="Post" /> 
    </form> 
    </div>'; // End block conversation 
} 
?> 
</div> 

<script type="text/javascript">  
$(".btnAnswer_news").live("click", function(){ 
    var num_show = this.id.replace(/\D/g, ""); 
    $("#display_form_id_" + num_show).toggle("fast"); 
}); 

var auto_refresh = setInterval(
    function() { 
     $("#the_river_loading").load("/home" + " .message_container_news"); 
    }, 3000 
); 
</script> 

很高興看到你。

Answer 1

這是因爲如果再次將內容加載到容器中，則每個js應用的樣式將被刪除（因爲它們是通過style =「」應用的，並且會刷新）。你應該移動窗體和按鈕到另一個Div，而不是在加載Div中。

Answer 2

如果我正確理解你的問題（你不是很描述性的），你只想毫不掩飾再次點擊時，對於使用show()代替toggle()的形式，讓您更換下面一行：

$("#display_form_id_" + num_show).toggle("fast"); 

這一個：

$("#display_form_id_" + num_show).show("fast"); 

如果你想保持textarea的文字，你可以像這樣：

var auto_refresh = setInterval(
    function() { 
     tx = $("#the_river_loading textarea[name='answer_text']").val(); 
     $("#the_river_loading").load("/home" + " .message_container_news", function(){ 
      $("#the_river_loading textarea[name='answer_text']").val(tx); 
     }); 
    }, 3000 
);