为什么在 onclick 事件处理程序中使用 return？答案

【问题标题】：Why is return used in onclick event handler?为什么在 onclick 事件处理程序中使用 return？
【发布时间】：2010-09-11 02:25:11
【问题描述】：

为什么在下面的 onclick 偶数处理程序中使用“return”，似乎在有或没有按钮的 onclick 事件中的返回规范的情况下都能正常工作？

input type="radio" name="radCPUSpeed" value="6 Ghz"
                       onclick="return radCPUSpeed_onclick(2)"

该函数似乎没有做任何事情，为什么在上面的输入声明中需要return？

function radCPUSpeed_onclick(radIndex)
   {
       var returnValue = true;
       if (radIndex == 1)
       {
           returnValue = false;
           alert("Sorry that processor speed is currently unavailable");
           // Next line works around a bug in IE that doesn't cancel the
           // Default action properly
           document.form1.radCPUSpeed[radCpuSpeedIndex].checked = true;
       }
       else
       {
           radCpuSpeedIndex = radIndex;
       }
       return returnValue;
   }

【问题讨论】：

标签： javascript

【解决方案1】：

从事件处理函数返回false 将阻止与事件关联的默认浏览器行为。返回任何其他值（包括undefined，如果没有执行return 语句则返回）不会。重要的是，返回 false 确实不会阻止事件在 DOM 树中冒泡，并且附加到 DOM 树更高节点的事件处理程序仍将被执行。

另请注意，这不适用于通过addEventListener 或attachEvent 附加的事件侦听器函数。此类函数中的返回值无效。

【讨论】：

谢谢，但是为什么下面的“onclick=”开头需要“return”： input type="radio" name="radCPUSpeed" value="6 Ghz" onclick="return radCPUSpeed_onclick (2)"
您可以将事件处理程序属性的值想象为事件触发时调用的函数体。从此函数返回 false 会阻止默认浏览器操作。
这是一个很好的总结一切的答案，假设一切都是正确的，重点： 1. 返回 undefined 与返回 false 不同。 2. 使用 addEventListener() 或 attachEvent() 添加的处理程序的返回值无效。 3. 从 HTML 嵌入的事件处理程序返回 false 会取消默认行为，但不会停止事件冒泡。谢谢

【解决方案2】：

当您从任何事件处理程序返回 false 时，该事件不会冒泡。所以可以说通常这个按钮会提交一个表单，当你返回 false 这不会发生。本质上它将阻止事件的默认操作。

【讨论】：

虽然事件确实没有冒泡，但您描述的行为与阻止默认操作有关。
要清楚，事件确实仍然冒泡，但是关于阻止默认浏览器操作的部分是正确的。

【解决方案3】：

基本上，在事件处理程序的情况下，'=' 符号之后的值或任何内容都是一个函数。作为一个原因，必须使用return，以便函数向事件处理程序返回一个布尔值-onclick、onsubmit 等。

onclick="return radCPUSpeed_onclick(2)

上面的代码可以中断为： onclick="function(){radCPUSpeed_onclick(2)} 因此，等号后面的内容实际上是在函数内部，需要返回语句。

【讨论】：