Question

点击链接时我需要打开子类/ div：

我有：

echo '<td><a class="openhiddenmessage" href="#">'.$title.'</a></td>'; //If user clicks here
echo '<div class="hiddenmessage" style="display:none">'.$message.'</div>';  //This shows up

问题是很多，所以我需要知道哪个属于每个。

这是JQuery：

$('.openhiddenmessage').click(function(){
   $('.hiddenmessage').show();
});

如何让它打开ot的孩子？

更新：由于某些原因，所给出的答案都没有起作用，所以这里是整个部分：

echo '<tr>';
echo '<td><a class="openhiddenmessage" href="#">'.$title.'</a></td>';
echo '<td>'.$date.'</td>';
echo '<td><a id="deletemessage" href="delete.php?id='.$id.'" class="delete">Delete</a></td>';
echo '<div class="hiddenmessage" style="display:none">'.$message.'</div>';  
echo '</tr>';

Answer 1

closest()搜索DOM树，您将需要类似

的内容

$('.openhiddenmessage').click(function () {
  $(this).closest('tr').find('.hiddenmessage').show();
});

编辑：jsFiddle表示您的初始HTML

Answer 2

...试

$('.openhiddenmessage').click(function(e){
 e.preventDefault();
$(this).closest('div').show();
});

如果你从数据库中获得结果，我个人会用id来做。

 echo '<td><a class="openhiddenmessage" data-id="'.$id.'" href="#">'.$title.'</a></td>'; //If user clicks here
 echo '<div class="hiddenmessage" id="msg-'.$id.'" style="display:none">'.$message.'</div>';

则...

  $('.openhiddenmessage').click(function(e){
   e.preventDefault();
  $('#msg-'+$(this).data('id')).show();
});

这样，您不仅限于将消息放在表格中。它可能在任何地方。即使是模态风格的弹出窗口也是可能的

Answer 3

看起来你div里面tr无效，你应该将你的div放在td中，

但是，您可以以当前形式

执行此操作

$('.openhiddenmessage').click(function(){
   $(this).closest('td').next('.hiddenmessage').show();
});

Answer 4

您可以将div放在a td旁边，然后您可以使用next()来显示该消息。这样，class不需要额外的div。例如：

HTML

<td>
    <a class="openhiddenmessage" href="#">Title</a>
    <div style="display:none">Message</div>
</td>

或您的PHP代码

echo '<td>' . 
        '<a class="openhiddenmessage" href="#">' . $title . '</a>' .
        '<div style="display:none">' . $message . '</div>' .
    '<td>';

JS

$('.openhiddenmessage').click(function(e){
    e.preventDefault();
    $(this).next().show();
});

jsFiddle

JQuery Open Child Div通过课程

4 个答案: