簡體   English   中英

將click事件綁定到jQuery Datatable on()上的tr元素不起作用

[英]Binding a click event to tr elements in jQuery Datatable on() doesn't work

我正在開發一個包含所有用戶的表,也可以通過單擊tablerow並在執行單擊后打開的表單中編輯數據來更改這些用戶。

如果我在頁面加載時加載了所有用戶,我的代碼工作正常。

一旦我更改了我的數據表以在數據表初始化時加載用戶,它將只在第一頁上工作。

如果我取消注釋我的ready(function()) fnInitComplete並刪除fnInitComplete它甚至不能在第一頁上工作。

這是我的代碼的相關部分:

        $(document).ready(function(){
            tbl = $('#nutzer').dataTable( {
                "bJQueryUI": true,
                "sScrollX": "100%",
                "bProcessing": true,
                "bServerSide": true,
                "iDisplayLength": 10,
                "sAjaxSource": "xhr.php",
                "sPaginationType": "full_numbers",
                "fnInitComplete": function() {
                    $('#nutzer tbody tr').on("click", function () {
                        aufklappen(this);
                    } );
                }
            } );

            $( "#create-user" ).button().click(function() {
                $( "#dialog-form" ).dialog( "open" );
            });
//            $('#nutzer tbody tr').on("click", function () {
//                aufklappen(this);
//            } );
        });

        function aufklappen(row) {
            if ( tbl.fnIsOpen(row) ) {
                tbl.fnClose(row);
            } else {
                set = tbl.fnSettings().aoOpenRows[0];
                (set != null) ? (tbl.fnClose(set.nParent)) : null;
                $.post("benutzerBearbeiten.php", { 
                    funktion : "benutzerDaten",
                    id : $(row).children( "td:first-child" ).text()
                }, function(data){
                    tbl.fnOpen( row, data);
                    $( "#deaktivieren").button().click(function(e){
                        e.preventDefault();
                        deaktivieren();
                    });
                    $( "#speichern").button().click(function(e){
                        e.preventDefault();
                        speichern();
                    });
                }
            ) };
        }

通過數據表分頁頁面加載或頁面更改后,我可以手動調用

$('#nutzer tbody tr').on('click', function () {
    aufklappen(this);
} );

並且click函數完美地綁定到tr。

在我看來,由datatables-plugin創建的元素沒有起到我定義的on()處理程序的dom,但我無法弄清楚原因。


編輯

利用“系統重啟”的答案,我最終刪除了fnInitComplete部分並添加

"asStripeClasses": [ "odd nutzer_tr", "even nutzer_tr"]

到初始化部分和

$("body").delegate(".nutzer_tr", "click", function () {
    aufklappen(this);
});

ready(function()) 額外的類nutzer_tr是為了防止打開的tablerow關閉。

我想你需要現場活動:

$('body').on('click', '#nutzer tbody tr', function () {
    aufklappen(this);
});

或者可以使用delegate()

$('body').delegate('#nutzer tbody tr', 'click', function () {
    aufklappen(this);
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM