Datatables.Net行cilck事件不能在第10行後工作

Question

我想打開一個模式，用作基於表格行點擊的編輯屏幕。但是，這隻適用於表格的前10行。使用得到的行數據

代碼IM是

$(document).ready(function() { 
    $("tr").click(function() { 
    //alert($(this.id).selector); 
    $("#updateCase").modal(); 
    }); 
}); 

表正在建立這樣的，但與538行

<table id='tblProcessing' class='table table-striped table-hover table-border'> 
<thead> 
    <tr> 
    <th class='centre RequestId' hidden>RequestId</th> 
    <th class='centre CMCReference'>CMC Reference</th> 
    <th class='centre FirstCustomerName'>First Customer Name</th> 
    <th class='centre FirstCustomerDOB'>First Customer DOB</th> 
    <th class='centre SecondCustomerName'>Second Customer Name</th> 
    <th class='centre SecondCustomerDOB'>Second Customer DOB</th> 
    <th class='centre CustomerPostcode'>Customer Postcode</th> 
    <th class='centre BusinessArea'>Business Area</th> 
    <th class='centre AccountType'>Account Type</th> 
    <th class='centre AccountOrCardNumber'>Account Or Card Number</th> 
    <th class='centre LOAOutcome'>LOA Outcome</th> 
    <th class='centre Outcome'>Outcome</th> 
    <th class='centre Response'>Response</th> 
    <th class='centre Complete'>Complete</th> 
    <th class='centre Edit'>Edit</th> 
    </tr> 
</thead> 

<tfoot class='foot'> 
    <tr> 
    <th>RequestId</th> 
    <th>CMC Reference</th> 
    <th>First Customer Name</th> 
    <th>First Customer DOB</th> 
    <th>Second Customer Name</th> 
    <th>Second Customer DOB</th> 
    <th>Customer Postcode</th> 
    <th>Business Area</th> 
    <th>Account Type</th> 
    <th>Account Or Card Number</th> 
    <th>LOA Outcome</th> 
    <th>Outcome</th> 
    <th>Response</th> 
    <th>Complete</th> 
    <th>Edit</th> 
</tr> 
</tfoot> 
<tbody> 
    <tr id='2211'> 
    <td class='centre RequestId' hidden>xxxx</td> 
    <td class='centre CMCReference'>xxxxx</td> 
    <td class='centre FirstCustomerName'>Susan Seymour</td> 
    <td class='centre FirstCustomerDOB'>08/10/1981 </td> 
    <td class='centre SecondCustomerName'></td> 
    <td class='centre SecondCustomerDOB'></td> 
    <td class='centre CustomerPostcode'>PE4 XXX</td> 
    <td class='centre BusinessArea'></td> 
    <td class='centre AccountType'>Mortgage</td> 
    <td class='centre AccountOrCardNumber'>xxxxxxxx</td> 
    <td class='centre LOAOutcome'>Not Seen</td> 
    <td class='centre Outcome'></td> 
    <td class='centre Response'></td> 
    <td class='centre Complete'>True</td> 
    <td class='centre Edit'><span class='btn><i id='xxxx' class='fa fa-pencil-square-o fa-2x edit' aria-hidden='true'></i></span></td> 
    </tr> 
</tbody> 

，我使用叫它$('#tblProcessing' ').DataTable();

讓我困惑的是前10行是可點擊的b隨後什麼也沒有。

任何和所有的幫助表示讚賞。

感謝

西蒙

Answer 1

的問題是，因爲下一個頁面是動態生成的DataTable的插件創建的，所以你需要使用委派事件處理程序：

$('#tblProcessing').on('click', 'tr', function() { 
    //alert($(this.id).selector); 
    $("#updateCase").modal(); 
});