Question

我试图将一行从一张桌子移到另一张桌子然后再回来。

我有这个工作去第一个表，但回来的事件没有开火。这是我的代码

HTML

<table id="table_source">
    <tbody>
        <tr>
            <td>Row</td>
            <td>1</td>
            <td><img src='move_image_path' alt='Move' class='move-row' /></td>
        </tr>
        <tr>
            <td>Another Row</td>
            <td>2</td>
            <td><img src='move_image_path' alt='Move' class='move-row' /></td>
        </tr>
    </tbody>
</table>
   <table id="table_dest" class="active"><a href="#">People</a>
        <tbody>
          <tr>
          </tr>  
        </tbody>
    </table>

Jquery的

  $("#table_source img.move-row").click(function (e) {            
             var tr = $(this).closest("tr").remove().clone();
             tr.find("img.move-row")
        .attr("src", "remove_image_path.jpg")
        .attr("alt", "Remove");
             $("#table_dest tbody").append(tr);
         });

         $("#table_dest img.move-row").click(function (e) {
             alert("hi") //THIS IS NOT FIRING
             var tr = $(this).closest("tr").remove().clone();
             tr.find("img.move-row")
        .attr("src", "move_image_path.jpg")
        .attr("alt", "Move");
             $("#table_source tbody").append(tr);
         });

Answer 1

您必须使用on jQuery回调。

 $("#table_dest").on('click', 'img.move-row', function (e) {
     alert("hi") //THIS IS NOT FIRING
     var tr = $(this).closest("tr").remove().clone();
     tr.find("img.move-row")
         .attr("src", "move_image_path.jpg")
         .attr("alt", "Move");
     $("#table_source tbody").append(tr);
 });

最初，当页面加载时，点击事件被绑定到现有图像。那些被添加到游戏中的人没有附加事件。通过使用on()，您可以解决此问题。

使用JQuery将表行从一个表移动到另一个表

1 个答案: