jquery - 引用 AJAX 加载的 DIV ID

标签 jquery ajax

我的网站上有一个“命令中心”栏,其中有一个登录/注销按钮、一个我的帐户按钮和一个消息按钮。如果用户未登录,指挥中心仅显示登录按钮。如果用户已登录,命令中心将显示注销、我的帐户和消息按钮。

当用户登录或注销时,我使用 jQuery AJAX 刷新命令中心。因此,当用户登录时,他/她的信息将发布到 php 页面,并且回调函数会刷新命令中心。我有另一个 jQuery AJAX 函数,当它检测到单击注销按钮(仅在用户登录后出现)时,它会发布到一个 php 页面来注销用户。

由于注销按钮是通过 AJAX 加载的,并且我的注销函数是在初始页面下载时加载的,因此注销函数不会响应注销按钮上的点击,即使该函数正在引用注销按钮的 ID。

让我的注销功能识别 AJAX 加载的注销按钮的最佳方法是什么?我最初的想法是在命令中心 div 上使用 mouseover 事件来封装我的注销功能,以便在用户登录并将光标移到 AJAX 加载的命令中心上后,该函数会根据当前的 HTML。缺点是每次用户将鼠标悬停在命令中心上时都会调用该函数,即使他们不想注销。

有没有更直接的解决方案?

最佳答案

你想要做的是使用 jQuery 的 on()功能。

代码可能如下所示:

$('body').on('click', '#log-out-button-id', function(){
    // logout code
});

本质上,您将事件附加到页面上不会更改的元素。出于性能原因,您应该尽可能使用最接近的稳定父元素。 (在您的情况下,这可能是 '#command-center'

关于jquery - 引用 AJAX 加载的 DIV ID,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15413364/

相关文章:

javascript - 将内容添加到新的空 iframe

javascript - 如何计算添加元素?

javascript - 如何设置 Ajax POST 请求以防止空响应出现 "no element found"?

php - 如何使用ajax请求删除laravel 5.3中的记录?

javascript - 动态加载新内容后 jquery 触发器不起作用

javascript - 使用 Jquery 获取 onClick 事件动态生成的输入值

javascript - 当用户将鼠标悬停在链接上时想要显示图标/选项

jquery - 循环遍历每个 HTML 表格列并使用 jQuery 获取数据

php - Document.ready() 函数

Firefox 中带有自定义 header 的 Javascript Dojo AJAX (XHR) 请求