触发表格行上的点击事件

Question

这是那些似乎没有任何效果的日子之一。

我想单击表格的一行并显示警报（还有很多，但这是我所有其他问题的根本原因）。

我在 Visual Studio 2017 中设置了一个非常简单的测试用例； 这是整个 cshtml 文件：

 <table id="filterTable">
        <tr>
            <td>header</td>
        </tr>
        <tr>
            <td>value</td>
        </tr>
</table>

<script>
    $(document).ready(function () {
        $('#filterTable tr').click(function () {
            alert('hello');
        });
    });
</script> 

我尝试了十几种不同的脚本，尤其是上述脚本的变体（例如，有和没有“(document).ready”部分），但我似乎无法让它工作。

我已经看到了这样的例子，并且代码非常有效，我不知道为什么我的不会。

我需要帮助缩小我做错了什么。

如果任何其他信息有助于故障排除，请告诉我。

Answer 1

您的代码需要 jQuery 库。 希尔是一个例子：

 $(document).ready(function () { $('#filterTable tr').click(function () { alert('hello'); }); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table id="filterTable"> <tr> <td>header</td> </tr> <tr> <td>value</td> </tr> </table>

Answer 2

您需要将 jquery.js 添加到您的页面以使用 jQuery

如果您使用本地外部库。 更好的链接地址是HTTPS://...

 $(document).ready(function () { $('#filterTable tr').on('click',function () { alert('hello'); }); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table id="filterTable"> <tr><td>header</td></tr> <tr><td>value</td></tr> </table>

Answer 3

  
 
  
  
  
 
   
 
    
        $(document).ready(function () {
            $('#filterTable tr').click(function () {
                alert('hello');
            });
        });
 
    
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <table id="filterTable">
            <tr>
              <td>header</td>
<td>header</td>
<td>header</td>
            </tr>
            <tr>
                <td>value</td>
<td>header</td>
<td>header</td>
            </tr>
    </table>
 
   
 
  


    enter code here