a标签 | Aryb1n's notebook

a标签

Aryb1n 5月 23, 2017

今天遇到了问题,所以在网上找了些资料,关于
a标签的href和onclick

大概

onclick里的事件先被执行,然后才是href中定义的页面跳转或者javascript伪协议
如果都定义了,想要阻止href的动作,就要使得onclick返回false,所以经常看到
```
<a onclick="xxx();return false;">
```
如果页面过长有滚动条，且希望通过链接的onclick事件执行操作。应将它的href 属性设为javascript:void(0);，而不要是#，这可以防止不必要的页面跳动(其实的话是不是javascript:;是一样的效果)

因为实际上#会代表着#top,而javascript:void(0);什么都不代表

丢个完整的demo

<!DOCTYPE html>
<head>
    <meta charset=utf-8>
</head>
<body>
<a href="go.html" onclick = "doSomething1()">link1</a>
<br>
<a href="javascript:void(0);" onclick = "doSomething2()">link2</a>
<script>
function doSomething1(){
    return confirm("离开?");
}
function doSomething2(){
    var ret = confirm("离开?");
    if(ret){
        window.location.href = "go.html";
    }
}
</script>
</body>

这两个link都能实现离开前确认的效果,长见识了

传说中的提交表单不跳转

原来是说可以这样子

使用display:none的iframe

使用AJAX
现在看到好像可以

<a href="javascript:void(document.form.submit())">

可不可以不写href

不写href就不会变蓝,,你的a看起来就是黑字
不过现在都不流行这样子的a了.都是css成按钮样式的了

资料

http://www.cnblogs.com/goldarch/archive/2010/06/16/1759031.html