以下是构建链接的两种方法,该链接的唯一目的是运行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>
当前回答
如果你问我,也不会;
如果您的“链接”仅用于运行某些JavaScript代码,则它不符合链接的资格;我建议使用带有onclick处理程序的<span>标记和一些基本CSS来模拟链接。链接是用于导航的,如果您的JavaScript代码不是用于导航,那么它不应该是一个<a>标记。
例子:
函数callFunction(){console.log(“函数调用”);}.js操作{光标:指针;颜色:#00f;文本装饰:下划线;}<p>我想在这里调用JavaScript函数</p>
其他回答
我强烈希望尽可能将JavaScript排除在HTML标记之外。如果我使用<a>作为单击事件处理程序,那么我建议使用<a class=“trigger”href=“#”>单击我</a> 。
$('.trigger').click(function (e) {
e.preventDefault();
// Do stuff...
});
需要注意的是,许多开发人员认为,使用锚标记来处理点击事件是不好的。他们希望您使用带有一些CSS的<span>或<div>来添加游标:指针;这是一个争论不休的问题。
您可以在这里使用javascript:void(0),而不是使用#来停止锚标记重定向到标头部分。
function helloFunction() {
alert("hello world");
}
<a href="javascript:void(0)" onclick="helloFunction();">Call Hello Function</a>
我使用以下方法
<a href="javascript:;" onclick="myJsFunc();">Link</a>
相反
<a href="javascript:void(0);" onclick="myJsFunc();">Link</a>
我基本上是在用渐进式增强来解释这篇实用文章。简单的答案是,您永远不会使用javascript:void(0);或#,除非您的用户界面已经推断JavaScript已启用,在这种情况下,您应该使用JavaScript:void(0);。此外,不要使用span作为链接,因为这在语义上是错误的。
在应用程序中使用SEO友好的URL路由,例如/Home/Action/Parameters也是一种很好的做法。如果你有一个链接到一个没有JavaScript的页面,你可以在之后增强体验。使用指向工作页面的真实链接,然后添加联机事件以增强演示。
这是一个示例。Home/ChangePicture是一个指向页面上的表单的工作链接,该表单带有用户界面和标准HTML提交按钮,但它被注入到带有jQueryUI按钮的模态对话框中看起来更好。无论哪种方式都有效,这取决于浏览器,满足移动优先开发。
<p><a href="Home/ChangePicture" onclick="return ChangePicture_onClick();" title="Change Picture">Change Picture</a></p>
<script type="text/javascript">
function ChangePicture_onClick() {
$.get('Home/ChangePicture',
function (htmlResult) {
$("#ModalViewDiv").remove(); //Prevent duplicate dialogs
$("#modalContainer").append(htmlResult);
$("#ModalViewDiv").dialog({
width: 400,
modal: true,
buttons: {
"Upload": function () {
if(!ValidateUpload()) return false;
$("#ModalViewDiv").find("form").submit();
},
Cancel: function () { $(this).dialog("close"); }
},
close: function () { }
});
}
);
return false;
}
</script>
肯定hash(#)更好,因为在JavaScript中它是一个伪方案:
污染历史实例化引擎的新副本在全局范围内运行,不尊重事件系统。
当然,使用onclick处理程序防止默认操作的“#”更好。此外,唯一目的是运行JavaScript的链接并不是真正的“链接”,除非当出现问题时,您将用户发送到页面上某个合理的锚点(只需#将发送到顶部)。您可以简单地使用样式表模拟链接的外观,而完全不用考虑href。
此外,关于牛神的建议,特别是:。。。href=“javascript_required.html”onclick=“…这是一种很好的方法,但它没有区分“禁用javascript”和“onclick失败”场景。