JavaScript内联事件语法

9

有没有理由更多地使用以下其中一种:

<input type="button" value="b1" onclick="manageClick(this)" />
<input type="button" value="b2" onclick="manageClick(this);" />
<input type="button" value="b2" onclick="manageClick(this);return false;" />
<input type="button" value="b3" onclick="return manageClick(this);" />
<input type="button" value="b4" onclick="javascript:return manageClick(this);" />

请不要浪费你宝贵的时间告诉我使用jQuery或attachEvent/addEventListener。这并不是我的问题的真正目的。


我无法理解你的问题的目标 :( - Sarfraz
我可以告诉你使用 input.onclick= manageClick; 并让 manageClick 查看 this 吗?这是当您不需要多个侦听器时,attachEvent/addEventListener的简单形式。 - bobince
@bobince。当然可以;)但是你知道我在模板方面,只是在质疑那些“returns”、“;”等是否有用。 - Mic
啊哈。 对于 type="button"return true/false 是无用的,因为没有默认操作可供允许/取消。 对于链接或提交按钮,则可能有用。 但是,通常应避免使用内联事件处理程序(除了偶尔可能需要它的一种情况:静态图像上的 img onload ),并且 javascript: 是非常错误的,表明作者不知道他们在做什么。 - bobince
@bobince 避免使用内联事件是一种信仰,一种避免混乱的方式,还是其他什么呢? - Mic
整个内容类型分离的事情确实有一点宗教色彩,哈哈。但总体来说,外部绑定确实有优势:较少的上下文嵌套意味着更少的转义规则(这里有很多问题源于对如何将字符串传递到JavaScript事件处理程序中感到困惑),代码也更简单、易读。经验表明,在页面上存在许多隐藏在多个事件处理程序中的逻辑的代码很难维护。 - bobince
2个回答

8
在这种特定情况下,前两者没有任何区别,分号是可选的。
第三个将防止发生任何默认动作,而前两个不会。
第四个将根据manageClick的返回值来防止或不防止默认操作。
第五个是不正确的。
(在合适的地方使用attachEvent/addEventListener--躲避并运行)

所以javascript:manageClick()是正确的写法吗?我认为javascript:已经过时了,只用于非事件属性。 - kb.
+1. 但我会改成“在适当的情况下,使用attachEvent/addEventListener”,并且我会问自己是否有这种情况。 - David Hedlund
@kb:不,我说"javascript:manageClick"是错误的写法。 - T.J. Crowder
@David:同意,已更改。:-) 是的,这几乎总是合适的。你想要设计师设计你的页面,软件工程师连接各种东西。 - T.J. Crowder
@T.J. Crowder:是的,但是内联的onclick属性将在控件可用时立即注册,这可能比DOMReady要早得多,通常在程序化地挂钩事件时(并且在页面中间创建一个脚本块,紧接着每个控件,仅包含对该控件的挂钩,是糟糕的设计和性能差)。如果您希望立即注册事件,则必须考虑此问题。如果您真的不关心这一点,那么我同意应该这样做[续] - David Hedlund
显示剩余3条评论

4
<input type="button" value="b3" onclick="return manageClick(this);" />

编辑 如果您希望控制元素的行为,例如对于 <a><input type="submit">,则使用返回更好,因此假设这是情况,那么上面就是您的答案,如果不是,请省略返回,并只使用 onclick="manageClick(this);"

此外,请查看关于使用 javascript: 的内容,链接为 http://crisp.tweakblogs.net/blog/313/the-useless-javascript-pseudo-protocol.html。^_^


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接