Question

我正在使用tablesorter和tablesorter.pager。这是我的代码。

$(document).ready(function() {
$("#peopletable")
        .tablesorter({ widthFixed: true, widgets: ['zebra'] })
        .tablesorterFilter({ filterContainer: $("#people-filter-box"),
            filterClearContainer: $("#people-filter-clear-button"),
            filterColumns: [1, 2, 3],
            filterCaseSensitive: false
        })
        .tablesorterPager({ container: $("#peoplepager") });

$("#peopletable tr.data").click(function() {
    var personid = $(this).attr('id');
    $.ajax({
    type: "POST",
    url: "/Search/GetDocumentsByPerson",
    data: { "id": personid },
    datatype: "json",
    success: function(data) {
        var results = eval(data);
        $("#documentstable > tbody tr").remove();
        $.each(results, function(key, item) {
            $("#documentstable > tbody:last").append(html);
        });
        $("#documentstable").trigger("update");
    }
});
});
});

一切都很有效，除非我点击下一页我的按钮点击事件不会触发。这是jquery tablesorter的已知问题吗？

Answer 1

这是因为元素已更新，您点击处理程序的元素已经消失，您可以使用.live()解决此问题，请更改此内容：

$("#peopletable tr.data").click(function() {

对此：

$("#peopletable tr.data").live('click', function() {

或者，如果#peopletable未被销毁，您可以使用.delegate()，如下所示：

$("#peopletable").delegate('tr.data', 'click', function() {

Answer 2

对于tablesorterPager使用表中的某些元素使用Jeditable（编辑就位）插件后，我还遇到了与 tablesorterPager 第二页相同的问题。

我已尝试在Jeditable中编辑数据绑定功能，如下所示

原始代码

 $(this).bind(settings.event, function(e) {

这里settings.event等于我们用选项定义的事件参数，例如：点击

修改后的代码

 $(this).live(settings.event, function(e) {

但是..我发现第一页以外的页面中的 tablesorterPager 错误不是因为元素事件的绑定。当我们将 tablesorterPager 调用到任何具有多行的表时，只有第一页的行该表受页面加载影响。所以只使用 Jeditable 插件调用第一页行。其他页面中的其他行未分配插件。由于这个原因，除了第一页之外的其他页面中的事件将不起作用。

为防止出现上述情况，我们可以在 updatePageDisplay 功能中添加 Jeditable 插件。

例如：

function updatePageDisplay(c) {

    $(".tablerowdata").each(function(){

            $(this).editable("ajax/save.php", {
              tooltip : "click to edit...",
              data   : {"selectid1":"selectval1","selectid2":"selectval2","selectid3":"selectval3"},
              type   : "select",
              submit : "ok",
              event     : "click",
              select : "true",
            });
          });

Answer 3

创建新元素不会复制使用实时方法执行的Click方法创建的事件。

点击事件未在第二页上注册

3 个答案: