在哪里放置'return false;'在 jQuery 函数中纠正页面跳转问题答案

【问题标题】：Where to place 'return false;' in a jQuery function to correct page jumping issue在哪里放置'return false;'在 jQuery 函数中纠正页面跳转问题
【发布时间】：2011-02-16 21:42:46
【问题描述】：

最初，我正在寻找显示/隐藏页面跳转问题的答案。在这里找到答案：link with href="#" scrolls page to top when used with jquery slidetoggle，我需要了解在以下代码中将return false 放在哪里：

toggleDetail : function(obj) {
    $(obj).parent().parent().next().toggleClass('hide');
    $(obj).text() == 'Show' ? $(obj).text('Hide') : $(obj).text('Show');
},

这是我对显示/隐藏的调用。 'href="javascript:void(0);"' 可以阻止页面跳转，我还需要'return false'吗？

<a href="javascript:void(0);" onclick="VSASearch.toggleDetail(this)">Show</a>

我尝试在每个$(obj) 行末尾的分号前添加“return false”，但事实并非如此。

【问题讨论】：

标签： jquery return

【解决方案1】：

您只需要在 onclick 处理程序上返回 false。如果 onclick 返回 false，则将停止回发/页面重新加载。

<a href="#" onclick="VSASearch.toggleDetail(this);return false;" />

或者您可以按如下方式返回函数的结果：

toggleDetail : function(obj) {
    $(obj).parent().parent().next().toggleClass('hide');
    $(obj).text() == 'Show' ? $(obj).text('Hide') : $(obj).text('Show');
    return false;
},

与

<a href="#" onclick="return VSASearch.toggleDetail(this);" />

【讨论】：

【解决方案2】：

您想从 onclick 处理程序返回 false

<a onclick="VSASearch.toggleDetail(this); return false">Show</a>

更好的是，使用不显眼的 javascript 并在 $() 函数中分配事件处理程序：

<a id="show">Show</a>

....

$(function() {
 ....
 $("#show").click = function() {
     VSASearch.toggleDetail(this);
     return false;
 }

【讨论】：

我认为没有 href 的锚标记不会生效吗？只需要坚持一个#。
我不确定。我只是假设你总是需要一个 href，我在问你这个问题 =D
是的，你是对的，href 是可选的！ w3schools.com/tags/tag_a.asp。你每天都会学到新东西。

【解决方案3】：

toggleDetail : function(obj) {
    $(obj).parent().parent().next().toggleClass('hide');
    $(obj).text() == 'Show' ? $(obj).text('Hide') : $(obj).text('Show');
    return false;
},

【讨论】：

太棒了....答案很快。 StackOverflow 是一个如此丰富的优秀信息和一个如此给予帮助的社区。在它自己的行上添加“return false”效果很好。谢谢 Glennular 和 GenericTypeTea。我喜欢尽可能多地在脚本文件中而不是在页面上的想法，所以我将驻留在那里。谢谢。
@Caroline，没关系，只是不要告诉我们的老板。