jQuery对话框仅显示一次

Question

我有一个表，其中包含来自用户的动态消息，管理员可以通过单击“答复”来答复这些消息。 完美运作。 问题是存在在对话框中打开用户消息的链接，因此他们可以看到完整的用户消息，以及其回复（如果已回复）。 他们只能一次看到该对话框。 再次单击它不会显示。

任何帮助，将不胜感激

表

foreach($content as $row)
{
    //print_r($row);
    echo '<tr data-id="'.$row['ConID'].'" input type="hidden" value="'.$row['ConID'].'">';
    echo '<td data-cn="'.$row['ConName'].'">'.$row['ConName'].'</td>';
    echo '<td data-em="'.$row['ConEmail'].'">'.$row['ConEmail'].'</td>';
    echo '<td data-cm="'.$row['ConMessage'].'" >'.substr($row['ConMessage'],0,30).'<a href="#" class = "open"> ...more</a><div class = "dialog"> <p>'.$row['ConMessage'].'</p></div></td>';
    echo '<td data-dt="'.$row['ConDate'].'">'.date('d/m/y', strtotime($row['ConDate'])).'</td>';
    if($row['Replied'] == 0){
        echo '<td data-rp="'.$row['Replied'].'">No</td>';
    }
    else{
        echo '<td><a href="#" class="openReply">See Reply</a><div class = "dialogReply"><p>'.$row['Reply'].'</p></div></td>';
    }
    if($row['Replied'] == 0){
        echo '<td><input type="button" class="replySender" id="replySender" value="Reply"/></td>';
    }
    else{
        echo'<td>Replied</td>';
    }
    echo '</tr>';
}

JQUERY

$(".dialog").hide(); $(".open").click(function(){
    $(this).next(".dialog").dialog();  
});
$(".dialogReply").hide(); $(".openReply").click(function(){
    $(this).next(".dialogReply").dialog();  
});

Answer 1

第二次不起作用的原因是，当您第一次“运行”它$（'＃my_div'）。dialog（）时，这会将元素#my_div移到主体的根目录中，包装器（DIV），因此$ .next（）将第二次失败，因为该元素不再在那里！ 我的建议是将ID设置为对话框，然后将这些ID保存在anchors（）中。 即

<td>
    <a href="#" class="openReply" data-dlg-id="random-id-1">See Reply</a>
    <div class="dialogReply" id="random-id-1">
        <p>My Reply</p>
    </div>
</td>
<td>
    <a href="#" class="openReply" data-dlg-id="random-id-2">See Reply</a>
    <div class="dialogReply" id="random-id-2">
        <p>Other Reply</p>
    </div>
</td>

并且您的javascript可能看起来像：

$(".dialogReply").hide();

$(".openReply").click(function(){
      var $dlg = $('#'+ $(this).attr('data-dlg-id'));
      if ($dlg.hasData('dialog'))
        $dlg.dialog('open');
      else
        $dlg.dialog();
});

我希望这有帮助。 最好！

Answer 2

感谢大家的答复。 我整理好了。

因此，一旦单击，div将被删除。 通过使用jquery clone（）修复了该问题：

$（“。dialog”）。hide（）;

$（“。open”）。click（function（）{$（this）.next（“。dialog”）。clone（）。dialog（）;}）; $（“。dialogReply”）。hide（）; $（“。openReply”）。click（function（）{$（this）.next（“。dialogReply”）。clone（）。dialog（）;}）;