Dblclick监听器只在我的代码中触发一次

时间:2017-01-05 14:01:01

标签: javascript jquery html javascript-events event-listener

我是Javascript的新手,我开发了以下仅运行一次的代码。

./yourfile
file://path/to/the/file

使用function display(arr) { $(".tbl tbody").empty(); for (i = 0; i < arr.length; i++) { $(".tbl tbody").append('<tr class="tblrow" id = "'+i+'"> <td><input id="editInput" type="text"/>'+arr[i].Empid+'</td><td>'+arr[i].name+'</td><td>' +arr[i].pd+'</td><td>'+arr[i].unplannedleaves+'</td><td>'+arr[i].response_time+'</td><td class = "tt"><button class="delbtn" id ="btn'+i+'">Delete</button></td></tr>'); $("td").css("text-align", "center"); $("td").css("border", "1px solid black"); $(".tt").css("border", "none"); $(".tbl").css("border", "none"); $(".delbtn").css("display", "none"); } } $("tr").on('dblclick', function() { var s = this.id; $("#btn" + s).css("display", "block"); }); $(".delbtn").click(function() { var s = this.id; var k = s.slice(3); arr.splice(k, 1); display(arr); });方法显示我的表格后。我第一次dblclick它行按预期工作并显示删除按钮。我单击删除行被删除,表重新呈现。但是,在此之后该行不再是dbl-clickable。我试过调试,但控件甚至不会进入dblclick监听器。

有人可以解释为什么会如此。这里出了什么问题?

1 个答案:

答案 0 :(得分:1)

绑定你的tr元素:

$(document).on('dblclick', "tr", function() {
  var s = this.id;
  $("#btn" + s).css("display", "block");
});

它将使用您的dblclick事件动态订阅任何新tr