javascript - 链接上的 jQuery Datatable javascript 不适用于多个页面

Question

我在使用 jQuery 的 Datatable 插件时遇到问题...我已经填充了一个表，并且特定列的单元格如下所示:

<a href="26" name="PO">12</a>

我已经阻止了 onclick 事件，它触发了这段代码:

$( 'a[name="PO"]' ).click(function(){
            event.preventDefault();
            var POid = $( this ).attr('href');
            var element = $( this );
            $( '<div id="Dialog">\
                <p class="error"></p>\
                <p style="text-align:center;" class="main">Entrez le P.O. associé à la commande</p>\
                <input type="text" class="POprompt"/>\
                </div>').dialog({
                resizable: false,
                height: 'auto',
                width:'400',
                modal: true,
                title: 'Ajout d\'un PO',
                show: 'blind',
                hide: 'drop',
                buttons:{
                    "Sauvegarder":function() {
                        $('.error').css('color','FF0000');
                        var prompt = $('.POprompt').val();
                        if (!isNaN(parseInt(prompt)))
                        {
                            $.post('setPO.php',{'PO':prompt,'id':POid},function(data)
                            {
                                element.text( prompt );
                                $('.main').css('color','#0F0');
                                $('.POprompt').css('visible','false');
                                $('.main').text("L\'ajout a été effectué avec succès.")
                                $( this ).dialog( "close" );
                                $('.error').text("");
                                $('.error').css('color','#FFF');
                            });
                        }
                        else
                        {
                            var error = $('.error');

                            error.text("Veuillez entrer des chiffres seulement.");
                            error.addClass( "ui-state-highlight" );
                            setTimeout(function() {
                                error.removeClass( "ui-state-highlight", 1500 );
                            }, 1000 );
                        }
                        $('.error').css('color','FF0000');
                    },
                    "Annuler":function() 
                        {
                            $( this ).dialog( "close" );
                        }       
                }
            } );
        });

但是当我转到第 2 页或第 3 页时，或者当我对结果进行排序并单击该单元格链接但该行是在与第一个页面不同的另一个页面中生成时，javascript 不会触发。

有人有想法吗？非常感谢你们，祝你们有美好的一天。

Answer 1

我知道这个问题已经得到回答，但是，它是不完整的，恕我直言，可能是错误的。多页数据表的问题是初始选择器在用户单击除默认第一页以外的任何页面时变得无用。这是因为 dataTable 为了呈现表格而对 DOM 做了一些可怕的事情。这具有禁用点击处理程序的副作用。

好消息是，除了列出所有元素之外，还有一种方法可以解决这个问题。

而不是...


$( 'a[name="PO"]' ).click(函数(){


试试这个:


$( "#dataTable tbody").on('点击', 'a[name="PO"]', function(){


阅读此 jquery 页面 (on()) 并查找有关延迟选择器的部分。