以下是构建链接的两种方法,该链接的唯一目的是运行JavaScript代码。在功能、页面加载速度、验证目的等方面,哪个更好。?
函数myJsFunc(){警报(“myJsFunc”);}<a href=“#”onclick=“myJsFunc();”>运行JavaScript代码</a>
or
函数myJsFunc(){警报(“myJsFunc”);}运行javascript代码</a>
以下是构建链接的两种方法,该链接的唯一目的是运行JavaScript代码。在功能、页面加载速度、验证目的等方面,哪个更好。?
函数myJsFunc(){警报(“myJsFunc”);}<a href=“#”onclick=“myJsFunc();”>运行JavaScript代码</a>
or
函数myJsFunc(){警报(“myJsFunc”);}运行javascript代码</a>
当前回答
这里还有一件更重要的事情要记住。第508节合规性。因此,我觉得有必要指出,您需要为JAWS等屏幕阅读器提供锚标记,以便能够通过选项卡将其聚焦。因此,解决方案“只使用JavaScript,忘记开头的锚”并不是其中的一个选项。只有当您无法让屏幕跳回到顶部时,才需要在href中启动JavaScript。您可以使用0秒的设置超时,让JavaScript在需要关注的地方启动,但即使是页面也会跳到顶部然后返回。
其他回答
“#”将使用户返回页面顶部,因此我通常使用void(0)。
javascript:;其行为类似于javascript:void(0);
老实说,我两个都不建议。我会使用一个样式化的<button></button>来实现该行为。
按钮链接{显示:内联块;位置:相对;背景色:透明;光标:指针;边框:0;填充:0;颜色:#00f;文本装饰:下划线;字体:inherit;}<p>一个看起来像<button type=“button”class=“link”>链接</button>的按钮</p>
这样您就可以分配onclick。我还建议通过脚本绑定,而不是在元素标记上使用onclick属性。唯一的问题是旧IE中无法禁用的伪3d文本效果。
如果必须使用A元素,请使用javascript:void(0);由于已经提到的原因。
如果onclick事件失败,将始终进行拦截。不会发生错误的加载调用,或基于哈希更改触发其他事件如果单击失败(onclick throws),哈希标记可能会导致意外行为,除非这是一个适当的失败行为,并且您希望更改导航历史记录,否则请避免它。
注意:您可以将0替换为javascript:void('删除记录123')之类的字符串,它可以作为一个额外的指示符,显示单击的实际操作。
只使用#会做出一些有趣的动作,所以如果你想节省JavaScript bla、bla、的输入工作量,我建议使用#self,。
我从你的话中了解到,你想要创建一个链接来运行JavaScript代码。
然后你应该考虑到有人在浏览器中阻止JavaScript。
因此,如果你真的要将该链接仅用于运行JavaScript函数,那么你应该动态添加它,这样即使用户没有在浏览器中启用JavaScript,也不会看到它,而你使用该链接只是为了触发一个JavaScript函数,在浏览器中禁用JavaScript时,使用这样的链接是没有意义的。
由于这个原因,当JavaScript被禁用时,它们都不好。
a如果启用了JavaScript,并且您只想使用该链接调用JavaScript函数,则
<a href="javascript:void(0)" onclick="myJsFunc();">Link</a>
比使用
<a href="#" onclick="myJsFunc();">Link</a>
因为href=“#”将导致页面执行不需要的操作。
此外,<a href=“javascript:void(0)”onclick=“myJsFunc();”>Link</a>优于<a href=”#“onclick=“myJsFunc(;)”>Link//a>的另一个原因是javascript被用作大多数浏览器的默认脚本语言。例如,InternetExplorer使用onclick属性来定义要使用的脚本语言类型。除非出现另一种好的脚本语言,否则Internet Explorer也会使用JavaScript作为默认语言,但如果另一种脚本语言使用JavaScript:,则会让Internet Explorer了解正在使用的脚本语言。
考虑到这一点,我更喜欢使用和锻炼
<a href="javascript:void(0)" onclick="myJsFunc();">Link</a>
为了让它成为一种习惯,为了更方便用户,请在JavaScript代码中添加此类链接:
$(document).ready(function(){
$(".blabla").append('<a href="javascript:void(0)" onclick="myJsFunc();">Link</a>')
});
我同意其他地方的建议,即应该在href属性中使用常规URL,然后在onclick中调用一些JavaScript函数。缺陷在于,它们在调用后自动添加return false。
这种方法的问题是,如果函数无法工作或出现任何问题,链接将变得不可点击。Onclick事件将始终返回false,因此不会调用正常的URL。
有一个非常简单的解决方案。如果函数工作正常,则返回true。然后使用返回的值确定是否应取消单击:
JavaScript
function doSomething() {
alert( 'you clicked on the link' );
return true;
}
HTML
<a href="path/to/some/url" onclick="return !doSomething();">link text</a>
注意,我否定了doSomething()函数的结果。如果它有效,它将返回true,因此它将被否定(false),路径/to/some/URL将不会被调用。如果函数返回false(例如,浏览器不支持函数中使用的内容或其他任何错误),则将其否定为true,并调用路径/to/some/URL。