Question

您好我正在尝试使用append（）生成动态HTML表格。我编写代码的方式是，如果用户想要在localStorage中输入数据，它首先检查它是否为空。如果它为空，则 if 块中的代码被执行。如果不为空则则执行 else块。所有这些代码都在getDetails（）JavaScript函数中。我已经将动态生成的表ID作为＆＃34; myTable＆＃34;。

  <table align="center" id="myTable">

  </table>

  <script>
   function getdetails(){
      if(localStorage.length == 0){
          ......
       }
      else{
          do something ...
      }

      }
  <script>

问题是我需要在单击表格行时获取行号。为此我创建了以下函数。

    $(window).load(function() {

     $("#myTable tr").click(function(){
        .....
        });
     });

当页面第一次刷新或加载时，上面的代码被执行（window.load）。但是当我在HTML表格中添加另一行时（代码超出了else块，因为localStorage不为空）并点击任何一行表行代码不起作用。谁能告诉我如何让.click（）每次都工作。谢谢。

Answer 1

您可以使用on关键字绑定事件以处理动态DOM元素

试试这样：

$("#myTable").on('click','tr',function(){

        //logic here..

 });

Answer 2

实际问题是你试图在页面加载时不存在的行上添加click事件。它们将在执行脚本后加载。所以这个问题的解决方案是从window.load中删除click事件并将其添加到数据填充代码后的脚本。

你也可以使用jquery的.on（）事件，无论如何都可以使用。

Answer 3

试试这个：

 $("#myTable tr").click(function(){
      alert('You clicked row '+ ($(this).index()+1) );
 });

来源：Which row number is clicked in a table

Answer 4

使用此

$（文件）.on（＆＃39;点击＆＃39;，＆＃39; #myTable tr＆＃39;，function（）{

//你的代码 }）;

在另一个函数中调用.click（）脚本

4 个答案:

使用此