Question

我有表行，我想让整行可点击。所以要做到这一点我对下面的ajax代码：

$(document).ready(function() {
    $('#myrow').click(function ()
    {
        //alert("hi");
        $.ajax({

            type: "post",
            url: "shownotification.jsp", 
            data: {
                notifyidd: $('#notifyidd').val(),
                notifyuser: $('#notifyuser').val()

            },
            success: function(msg){      
                    //if(msg == "success")
                    alert('Data updated.');
                    window.location.reload();
            }
        });
    });

});

但问题是它只是让我的第一行可以点击，而其他所有行都没有。可能是什么原因？请帮忙。

Answer 1

似乎您目前正在为id重复tr，请尝试申请课程：

<tr class="myrow" ......

然后您可以使用.按类定位元素：

$(document).ready(function() {
    $('.myrow').click(function () {
        // Your code here
    });
});

Answer 2

试试这个

$(document).on('click', '#table-id tr', function() {
    alert('Hello');
});

Answer 3

使用 on 绑定代码，并使用之前的代码

完成

<强> HTML

<table>
 <tbody> 
   <tr class="myrow">.......
   </tr>
 </tbody>
</table>

<强>的jQuery

您可以尝试两种方法

$(document).ready(function() {
    $('.myrow').click(function ()
    {
//your stuff

    });

/***or can try this below method**/
$('table').on('click', 'tr', function() {
   //your stuff 
});

});

Answer 4

在您的代码中，您将在ID上提供点击事件

即。 $('#myrow').click(function ()

所以它没有用，因为div的id必须是唯一的。使用类名更改您的行ID然后它将正常工作

$('.myrow').click(function ()

请参阅以下链接以供参考

Demo Link

表格HTML

 <table style="width:300px">
<tr class="tableRow">
  <td>Jill</td>
  <td>Smith</td>        
  <td>50</td>
  </tr>
<tr class="tableRow">
  <td>Eve</td>
  <td>Jackson</td>      
  <td>94</td>
</tr>

<tr class="tableRow">
  <td>John</td>
  <td>Doe</td>      
  <td>80</td>
</tr>
</table>

点击事件的脚本

$(".tableRow").click(function(e){
  alert("Table Tr Clicked");
});

在jsp中使表行可单击

4 个答案: