移動使用事件偵聽器錶行連接

我與引導，也就是實現了一個表：移動使用事件偵聽器錶行連接

<table id="user-area-table" class="table"> 
    <thead> 
    <tr> 
     <th>Name</th> 
     <th>Adjust</th> 
     <th>Visibility</th> 
     <th colspan="2">Order</th> 
     <th></th> 
    </tr> 
    </thead> 
    <tbody> 
    </tbody> 
</table>

，然後從選擇，用戶填充表。表中的每一行都有一些可能的操作：向上，向下，刪除等我添加了事件偵聽器來執行這些操作，在JQuery之前預先掛接/附加所需的錶行。

在諸如以上之類的操作中，使用JQuery刪除現有行，並且必須將其重新插入到DOM中。

 
$("#reference").on('click', '.fa-sort-asc', function(evt) { 
    $("#reference").prev().before($("#reference")); 
});

我的問題是，我現在必須添加事件偵聽器的DOM元素都是新的，但我在事件偵聽器回調的一個作爲距離。我懷疑處理這個問題的方法是添加一些代碼來捕獲我動態添加的tr上的任何事件，但我不確定如何執行此操作。

更新：

要添加行到表中，這是我目前在做什麼。本質上，我使用從select中獲取的引用和名稱構造錶行html，然後將其插入到表中。

var rowdata = '<tr id="' + reference + '" class="prop-layer"><td>' + name + '</td><td><a href="#"><i class="fa fa-adjust"></i></a></td><td><input type="checkbox" name="checkbox1" class="slider" data-size="mini" checked></td><td><a href="#"><i class="fa fa-sort-asc"></i></a></td><td><a href="#"><i class="fa fa-sort-desc"></i></a></td><td><a href="#"><i class="fa fa-trash"></i></a></td></tr>'; 
$('#user-area-table tbody').prepend(rowdata);

來源

2016-04-07 timbo

你可以分享有'＃reference'的標記以及它如何堆疊在它的兄弟姐妹中嗎？ – gurvinder372

不要添加和刪除事件偵聽器，而應考慮在父級上定義它們。 – freakish

如果我已經動態地添加子元素，這會工作嗎？ – timbo

您事件處理函數分配到一些家長，像body，像這樣：

$("body").on('click', 'tr', function(evt) { 
});

現在，您可以動態地左右移動TR，它會保持它的事件處理程序。你可以在這裏閱讀更多關於它的信息：http://api.jquery.com/on/ 這將指向tr。

來源

2016-04-07 06:14:36

移動使用事件偵聽器錶行連接

回答

相關問題