单击表格标题时隐藏表格行答案

【问题标题】：Hiding table rows when clicking on table headers单击表格标题时隐藏表格行
【发布时间】：2017-10-16 04:40:38
【问题描述】：

我试图在按下表格标题时隐藏我的行，但我使用的代码似乎不起作用。

这是脚本：(jQuery)

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
    $(document).ready(function(){

        var rows = $('Game tr');

        $("Game th").click(function(){
            alert("Clicked");
            rows.hide(1000);
        });

    });
</script>

和表格部分：

    $results = mysql_query("SELECT * FROM game WHERE summonerId='$ID' ORDER BY TimeId DESC");

    echo "<table id='Game'>";
    echo "<tr> <th> CLICK HERE </th> </tr>";
    while($row = mysql_fetch_array($results))
    {
        echo "<tr> <td>";
        echo $row['TimeId'];
        echo "</td> </tr>";

    }
    echo "</table>";

我不知道为什么这不起作用。

【问题讨论】：

$('#Game tr');是语法

标签： javascript php jquery html-table show-hide

【解决方案1】：

您想在 ID 选择器中添加 #：

$(function(){
   var $rows = $('#Game tr');
   $("#Game th").on("click",function(){
    alert("Clicked");
    $rows.hide(1000);
  });
});

如果您想保持 TH 可见，您可能需要使用

var $rows = $('#Game tr:not(":has(th)")');

【讨论】：

它起作用了，我现在因为忘记了“#”而感到很愚蠢......我让它在 10 分钟内得到回答，你要快速解决这个问题。 XD

【解决方案2】：

在 jquery 选择器中，您需要通过 ID 指定表，并在其前面加上 #。

试试

var rows = $('#Game tr');
$("#Game th").click(function(){

【讨论】：

【解决方案3】：

你在选择器中忘记了#

$(document).ready(function(){

    var rows = $('#Game tr');

    $("#Game th").click(function(){
        alert("Clicked");
        rows.hide(1000);
    });

});

【讨论】：

【解决方案4】：

当您需要使用其id in jquery 访问任何元素时，您必须使用#

改变

<script>
    $(document).ready(function(){

        var rows = $('Game tr');

        $("Game th").click(function(){
            alert("Clicked");
            rows.hide(1000);
        });

    });
</script>

到

<script>
    $(document).ready(function(){

        var rows = $('#Game tr');

        $("#Game th").click(function(){
            alert("Clicked");
            rows.hide(1000);
        });

    });
</script>

【讨论】：