如何在 JQuery 中加载 AJAX 内容后触发事件处理程序

发布于 2024-08-19 03:38:19 字数 633 浏览 10 评论 0原文

我正在尝试使用 AJAX 请求将一些信息加载到使用 JQuery 的表中。我可以轻松加载内容，但在添加事件处理程序以在加载的内容上应用样式时遇到问题。

我正在将条带小部件应用到表中。但是，当我的 AJAX 请求返回并且我的信息附加到表主体时，它没有应用样式。

JQuery 教程提到使用 load 事件来处理这个问题，但我无法让它工作。

任何帮助将不胜感激。

$(document).ready(function(){
    $("#cowTable").tablesorter();
    addTableStriping();
});

function addTableStriping(){
    $("#cowTable").tablesorter({
        // striping looking
        widgets: ['zebra']  
    });
};

$(function(){
    $("#loadCowsButton").click(function(){
        $.post("loadCows.php", "scottm", function(xml) {
            $("#cowTable tbody").append(xml);
        });
    });
});

原文

I'm trying to use an AJAX request to load some information into a table using JQuery. I can load the content easily but I am having problems adding event handlers to apply style on the loaded content.

I am applying a striping widget to the table. However when my AJAX request comes back and my information is appended to the table body it does not have the style applied.

The JQuery tutorial mentions using the load event to handle this, but I can't get it to work.

Any help would be appreciated.

$(document).ready(function(){
    $("#cowTable").tablesorter();
    addTableStriping();
});

function addTableStriping(){
    $("#cowTable").tablesorter({
        // striping looking
        widgets: ['zebra']  
    });
};

$(function(){
    $("#loadCowsButton").click(function(){
        $.post("loadCows.php", "scottm", function(xml) {
            $("#cowTable tbody").append(xml);
        });
    });
});

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

雨的味道风的声音 2024-08-26 03:38:19

我已经找到了解决方案。更新后需要触发“applyWidgets”。感谢大家的帮助，没有你们的帮助我就不会发现这个问题。

$(function(){
    $("#loadCowsButton").click(function(){
        $.post("loadCows.php", "scottm", function(xml) {
            $("#cowTable").append(xml);
            $("#cowTable").trigger("update");
            $("#cowTable").trigger("applyWidgets")
        });
    });
});

I've found a solution for this. You need to trigger "applyWidgets" after updating. Thanks for all the help from everyone, I wouldn't have found this out without your help.

$(function(){
    $("#loadCowsButton").click(function(){
        $.post("loadCows.php", "scottm", function(xml) {
            $("#cowTable").append(xml);
            $("#cowTable").trigger("update");
            $("#cowTable").trigger("applyWidgets")
        });
    });
});

回复收藏 0 原文

旧瑾黎汐 2024-08-26 03:38:19

您可能想尝试 Livequery 插件

Live Query 通过绑定事件或即使在页面加载和 DOM 更新之后，也会自动触发匹配元素的回调。

回复收藏 0 原文

左耳近心 2024-08-26 03:38:19

这是您应该做的：

在 tablesorter 网站上找到它。

简而言之，您应该在附加数据后调用 $( "#cowTable" ).trigger( "update" ); 。

回复收藏 0 原文

葮薆情 2024-08-26 03:38:19

为什么不在 AJAX 回调中调用它呢？

$(function(){
    $("#loadCowsButton").click(function(){
        $.post("loadCows.php", "scottm", function(xml) {
            $("#cowTable tbody").append(xml);
            addTableStriping(); // <-- here
        });
    });
});

Why not just call it in the AJAX callback?

$(function(){
    $("#loadCowsButton").click(function(){
        $.post("loadCows.php", "scottm", function(xml) {
            $("#cowTable tbody").append(xml);
            addTableStriping(); // <-- here
        });
    });
});

回复收藏 0 原文

此生挚爱伱 2024-08-26 03:38:19

这应该可以做到..

$(function(){
    $("#loadCowsButton").click(function(){
        $.post("loadCows.php", "scottm", function(xml) {
            $("#cowTable tbody").append(xml);
            $("#cowTable").trigger( "update" );
        });
    });
});

this should do it ..

$(function(){
    $("#loadCowsButton").click(function(){
        $.post("loadCows.php", "scottm", function(xml) {
            $("#cowTable tbody").append(xml);
            $("#cowTable").trigger( "update" );
        });
    });
});

回复收藏 0 原文

~没有更多了~