使用Jquery在注释中加载回复表单
我在一页上有几条评论。所有评论都有一个回复链接。单击时,每个链接都会转到一个php文件,其中所有注释都从数据库中选择,然后加载到div(#comment_results)。此外,现在单击的回复链接包含一个回复表单 当我点击一个回复链接时,上面的代码工作正常。但是,如果我单击另一条评论上的回复链接,我将被重新定向到带有输出的php文件。下面是Html代码。点击链接后,php文件将把回复表单添加到特定的注释中使用Jquery在注释中加载回复表单,jquery,load,Jquery,Load,我在一页上有几条评论。所有评论都有一个回复链接。单击时,每个链接都会转到一个php文件,其中所有注释都从数据库中选择,然后加载到div(#comment_results)。此外,现在单击的回复链接包含一个回复表单 当我点击一个回复链接时,上面的代码工作正常。但是,如果我单击另一条评论上的回复链接,我将被重新定向到带有输出的php文件。下面是Html代码。点击链接后,php文件将把回复表单添加到特定的注释中 $('a.reply_links').bind('click', function(e)
$('a.reply_links').bind('click', function(e) {
var url = $(this).attr('href');
$('#comment_results').load(url);
// load the html response into a DOM element
e.preventDefault(); // stop the browser from following the link
return false;
});
4小时前作者:朱利安
评论一
5小时前,作者:朱利安
评论二
感谢Jillian如果您的查询版本为1.7+,您可以使用委派事件,因为我认为您的问题是您正在单击在原始事件绑定后创建的回复链接
<div class="row">
<div id="comment_results" class="large-12 columns">
<div class="panel"><div class="row" id="116">
<div class="large-10 columns">
<p>4 hours ago by <strong>Julian</strong>
<br />Comment One</p></div>
<div class="large-2 columns right">
<a class="reply_links" href="mylink to php file">reply</a>
</div></div></div>
<div class="panel"><div class="row" id="115">
<div class="large-10 columns">
<p>5 hours ago by <strong>Julian</strong><br />
Comment Two</p></div>
<div class="large-2 columns right">
<a class="reply_links" href="mylink to php file">reply</a>
</div></div></div>
</div>
</div>
如果
.reply\u links
链接位于#comment\u results
内,则它将被.load()
调用替换,因此.bind()
仅在页面加载时第一次起作用。如果您使用的是正确版本的jQuery,Claudio的建议可能是最简单的解决方案。如果这不是一个选择,研究。在这种情况下,提供示例标记也有助于确定问题的根本原因 我正在使用jqueryv1.9.1。尝试了上面的代码,现在每个链接都重新指向我的php文件。正如Michael所说,我看到这种情况发生在DOM中的容器被删除时(可能是在您关闭回复消息之后),因此它不会将页面内容加载到容器中,而是将您带到实际页面,或者用新页面替换整个DOM。我的建议是查看你的“关闭”代码,看看你是否在任何地方销毁/移除容器。我检查了源代码,仍然完好无损。
$(document).on('click', 'a.reply_links' function(e){ .. })