已知a標籤的執行順序是onclick->href屬性
#当点击浏览器a标签的时候,浏览器的默认机制如下:
1、触发a的click事件
2、读取href属性的值
3、如果是URI则跳转
4、如果是javascript代码则执行该代码
如何改變這個機制,使得在onclick事件執行完畢時在去執行href屬性的url進行跳轉,其中onclick事件中的函數發送了ajax請求,根據返回值對href屬性進行了修改
修改href屬性後需要在目前瀏覽器新開頁面
update------------------------2017.06.30------------------- -----------------
經過測試,將ajax請求修改為同步執行,依然不能夠使a標籤的onclick函數執行完畢再去執行href的動作
究其原因,猜測可能是ajax修改為同步請求,會阻塞目前頁面的其他操作,
但a標籤的已經完成了點擊,就繼續執行了後續的href動作,而href動作此時是void(0),此時ajax的請求還沒有返
回,也就是說ajax的同步請求並沒有阻塞a標籤的動作
期待更佳答案
过去多啦不再A梦2017-07-01 09:14:15
$('a').click(function(e) {
雷雷var _ = $(this)
$.get(xx, function() {
});
})
曾经蜡笔没有小新2017-07-01 09:14:15
在onclick裡面使用js跳轉頁
//ajax start
success:function(){
//todo。。。。。
window.location.href = 'url'
}
天蓬老师2017-07-01 09:14:15
瀏覽器所有的是有的預設事件的禁用,都可以用event.preventDefault()
來阻止,剩下的在你的回調函數裡,你可以任意的去操作, 當然如果你需要兼容IE8及以下,可以相容寫法如下:
// event 为你的监听onclick回调函数中传递的参数
event.preventDefault ? event.preventDefault() : (event.returnValue = false);
曾经蜡笔没有小新2017-07-01 09:14:15
久等了,請吃
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<a href="" target="_blank">click</a>
<script>
function aTagCustomEvent(e) {
var tag = e.target;
//setTimeout模拟异步的ajax请求,时间间隔假设为1秒
setTimeout(function() {
tag.href = 'xxx';
tag.onclick = function() {};
tag.click();
tag.onclick = aTagCustomEvent;
}, 1000)
return false;
}
//为页面中所有a标签设置onclick事件
var aTags = [].slice.call(document.getElementsByTagName("A"));
aTags.forEach(function(tag) {
tag.onclick = aTagCustomEvent;
})
</script>
</body>
</html>