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

Question

我遇到了 jQuery 数据表插件的问题...我已经填写了一个表格，并且特定列的单元格如下所示：

\n\n

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

\n\n

我已经阻止了 onclick 事件，它会触发以下代码：

\n\n

$( \'a[name="PO"]\' ).click(function(){\n            event.preventDefault();\n            var POid = $( this ).attr(\'href\');\n            var element = $( this );\n            $( \'<div id="Dialog">\\\n                <p class="error"></p>\\\n                <p style="text-align:center;" class="main">Entrez le P.O. associ\xc3\xa9 \xc3\xa0 la commande</p>\\\n                <input type="text" class="POprompt"/>\\\n                </div>\').dialog({\n                resizable: false,\n                height: \'auto\',\n                width:\'400\',\n                modal: true,\n                title: \'Ajout d\\\'un PO\',\n                show: \'blind\',\n                hide: \'drop\',\n                buttons:{\n                    "Sauvegarder":function() {\n                        $(\'.error\').css(\'color\',\'FF0000\');\n                        var prompt = $(\'.POprompt\').val();\n                        if (!isNaN(parseInt(prompt)))\n                        {\n                            $.post(\'setPO.php\',{\'PO\':prompt,\'id\':POid},function(data)\n                            {\n                                element.text( prompt );\n                                $(\'.main\').css(\'color\',\'#0F0\');\n                                $(\'.POprompt\').css(\'visible\',\'false\');\n                                $(\'.main\').text("L\\\'ajout a \xc3\xa9t\xc3\xa9 effectu\xc3\xa9 avec succ\xc3\xa8s.")\n                                $( this ).dialog( "close" );\n                                $(\'.error\').text("");\n                                $(\'.error\').css(\'color\',\'#FFF\');\n                            });\n                        }\n                        else\n                        {\n                            var error = $(\'.error\');\n\n                            error.text("Veuillez entrer des chiffres seulement.");\n                            error.addClass( "ui-state-highlight" );\n                            setTimeout(function() {\n                                error.removeClass( "ui-state-highlight", 1500 );\n                            }, 1000 );\n                        }\n                        $(\'.error\').css(\'color\',\'FF0000\');\n                    },\n                    "Annuler":function() \n                        {\n                            $( this ).dialog( "close" );\n                        }       \n                }\n            } );\n        });\n

\n\n

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

\n\n

有人有主意吗？提前非常感谢大家，祝你有美好的一天。

\n

Answer 1

我意识到这个问题已经得到了回答，但是，它是不完整的，而且恕我直言，它可能是错误的。多页数据表的问题是，当用户单击默认首页以外的任何页面时，初始选择器将变得无用。这是因为 dataTable 为了渲染表格而对 DOM 做了一些可怕的事情。这会产生禁用点击处理程序的副作用。

好消息是，除了列出所有元素之外，还有一种方法可以处理此问题。

代替...

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

尝试这个：

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

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