Question

我目前正在开发ASP.Net应用程序，并且即时构建HTML表。

除标题行之外的每个表行都具有重新排序的能力。在主要工作中，但是我写的代理事件并不总是触发，因此用户可以在发生任何事情之前点击一段时间。

请查看我的代码，让我知道我在哪里出错，因为这需要始终如一地为每个浏览器工作。

$('td').on('click', "a.up, a.down, a.top, a.bottom", function () {    

console.log("up or down arrow clicked");    

var row = $(this).parents("tr:first");    
var thisTable = row.closest("table");    
if ($(this).is(".up")) {    
    if (row[0].rowIndex > 1) {    
        row.insertBefore(row.prev());    
    }    
} else if ($(this).is(".down")) {    
    row.insertAfter(row.next());    
} else if ($(this).is(".top")) {    
    row.insertBefore($("table tr:first"));    
    row.insertAfter(row.next());    
} else {    
    row.insertAfter($("table tr:last"));    
}    

});

非常感谢任何和所有帮助。

Answer 1

而不是：

$('td').on('click', "a.up, a.down, a.top, a.bottom", function () {

尝试

$(document).on('click', "a.up, a.down, a.top, a.bottom", function () {

Answer 2

2件事：

将$('td').on('click',更改为$('table').on('click',
您应该检查is('.top')

hasClass('.top')

以下是更新的代码：

$('table').on('click', "a.up, a.down, a.top, a.bottom", function() {

  console.log("up or down arrow clicked");

  var row = $(this).parents("tr:first");
  var thisTable = row.closest("table");
  if ($(this).hasClass(".up")) {
    if (row[0].rowIndex > 1) {
      row.insertBefore(row.prev());
    }
  } else if ($(this).hasClass(".down")) {
    row.insertAfter(row.next());
  } else if ($(this).hasClass(".top")) {
    row.insertBefore($("table tr:first"));
    row.insertAfter(row.next());
  } else {
    row.insertAfter($("table tr:last"));
  }

});

Answer 3

更改代码：

$('td').on('click', "a.up, a.down, a.top, a.bottom", function () { ....

致：

$(document).on('click', "a.up, a.down, a.top, a.bottom", function () { ...

Jquery没有触发动态创建的表

3 个答案: