Question

当我点击th时，我正试图显示表格行，但我不知道该怎么做。这就是我现在所拥有的：

    <th colspan="3" class="subth">Empresa São João</th>
                        <tr class="hidethis">
                            <td>1</td>
                            <td>Linha Tangerina</td>
                            <td>R$ 20,05</td>
                        </tr>

和JQuery / JavaScript是这样的：

                        $('.hidethis').hide();   
                        $('.subth').click(function(){
                            $(this).next().toggle();
                        });

我的意思是，如果这部分代码不够，我可以在

之后发送更多内容

*编辑：* 隐藏正在工作，什么不起作用是切换！感谢

如果我使用这个： $('tbody').click(function(){ $(this).find('tr').toggle(); });

它“有效” 事情是：我有两个与tr的，所以他们两个同时显示。

*编辑2.0：*

伙计们，我知道了！我的意思是，它并不完美，因为它总会显示一组<tr>，但我觉得很好这是我提出的代码（它可能搞砸了，哈哈）

$('.hidethis2').hide();   

$('tbody').click(function(){
     $('tr.hidethis').toggle();
     $('tr.hidethis2').toggle();
});

谢谢！

Answer 1

这是我的解决方案：

＆＃13;

$('th').click(function(ev) {
  $(this).parent('tr').next('.row').toggleClass('hide');
})

＆＃13;

.hide {
  display: none;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table style="width:100%">
  <tr>
    <th>Name</th>
    <th colspan="2">Telephone</th>
  </tr>
  <tr class="row">
    <td>Bill Gates</td>
    <td>55577854</td>
    <td>55577855</td>
  </tr>
</table>

＆＃13;

Answer 2

尝试一次

＆＃13;

$(document).ready(function(){
$('th').click(function(){
$('.next-tr').fadeToggle();
});
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table style="width:100%;">
  <tr height="25">
  <th width="50%">1St</th>
    <th width="50%">2Nd</th>
  </tr>
  <tr class="next-tr">
  <td style="text-align:center;">1</td>
    <td style="text-align:center;">2</td>
  </tr>
  </table>

＆＃13;

Answer 3

也许这是你的解决方案..

<table border="1px">
<tr>
    <th colspan="3" class="subth">
        My header
    </th>
</tr>
 <tr class="hidethis">
    <td>1</td>
    <td>Linha Tangerina</td>
    <td>R$ 20,05</td>
 </tr>
</table>

jQuery文件是：

<script>
   $(document).ready(function(){
    $(".subth").click(function(){
        $(".hidethis").toggle();
    });
});
</script>

想一想，这是你的解决方案..谢谢..

使用JavaScript / JQuery在表格中切换

3 个答案: