当我使用jquery .html或.append在DOM中添加元素时,页面会跳转到该位置。
我怎么能让它不跳,因为我希望我的用户能够点击“将线程保存到收藏夹”并且它不会跳转到“我保存的线程”因为那么用户必须在列表中向下导航线程再次。
编辑:我用过这个: // save thread
$("a.save_thread").live("click", function(event) {
event.preventDefault();
$.post('controllers/ajaxcalls/threads.php', {method: 'save_thread', thread_id: event.target.id}, function(data) {
}, 'json');
return false;
});
但是返回false并没有做任何事情。实际上,虽然它不使用append()或html(),但它仍然跳转到页面开始。
答案 0 :(得分:4)
return false
或preventDefault
是阻止关注链接的正确方法。检查您的JavaScript错误控制台。如果处理程序函数中存在异常,则不会返回false并且将跟随链接。
但是,您应该考虑将链接更改为<button>
。你在这里所拥有的不是一个环节,而是与任何地方的联系;这是一个动作。按钮是一种更好的建模方法,因为它没有跟踪链接的行为,或者允许用户在新选项卡中单击以打开链接的目标,或者右键单击添加到书签(等等)。因此,您不必担心阻止默认操作停止页面移动。
如果您不希望它看起来像3D按钮,您可以随时使用CSS来重新设置它,例如。 border: none; background: white; color: blue; text-decoration: underline;
。虽然你不能在IE中完全重新设置它,但错误地增加了一些额外的填充,这通常无关紧要。
答案 1 :(得分:3)
我认为跳跃不是.html()
或.append()
。而是,检查您正在执行的函数是否返回false:
$('a.pseudolink').click(function () {
$(this).html('foobar!');
return false; // !!!
});
这可以防止点击<a class="pseudolink" href="#newcontent">
,链接目标被激活。
答案 2 :(得分:1)
一个真正的kludge来防止这种情况是在发布这样的帖子之前从元素中删除href属性:
$("a.save_thread").live("click", function(event) {
$(this).removeAttr("href");
$.post('controllers/ajaxcalls/threads.php', {method: 'save_thread', thread_id: event.target.id}, function(data) {}, 'json');
});
您还可以通过保存并在完成操作后重新添加href来恢复href。
var href = $(this).attr('href');
//do actions
$(this).attr('href', href);
我以前在自己的开发中使用过这个,但看看它是否符合你的目的。