1. 程式人生 > >a標籤的href和onclick屬性同時存在點選事件先觸發

a標籤的href和onclick屬性同時存在點選事件先觸發

  • onclick的事件被先執行,其次是href中定義的(頁面跳轉或者javascript)
  • 同時存在兩個定義的時候(onclick與href都定義了),如果想阻止href的動作,在onclick必須加上return false; 一般是這樣寫onclick="xxx();return false;".
  • 在href中定義的函式如果有返回值的話,當前頁面的內容將被返回值代替
  1. 如果頁面過長有滾動條,且希望通過連結的 onclick 事件執行操作。應將它的 href 屬性設為 javascript:void(0);,而不要是 #,這可以防止不必要的頁面跳動;
  2. 所以,比較推薦的寫法是<a href="javascript:void(0)" onclick="fn(this)"> 

  3. <a href="javascript:void(0);" onclick="javascript:goUrl('http://www.sina.com');return false;">跳轉3</a>

<a href="javascript:void(0)" onclick="subgo()">點我</a>

在這裡,javascript:void(0),沒啟實質上的作用,它僅僅是一個死連結,執行的函式是subgo()。

<a href="#" onclick="subgo()">點我</a>與<a href="javascript:void(0)" onclick="subgo()">點我</a>區別。

實際上 #包含了一個位置資訊預設的錨是#top 也就是網頁的上端 ,而javascript:void(0) 僅僅表示一個死連結,沒有任何資訊。所以呼叫指令碼的時候最好用void(0)

    href一般是指向一個URL地址,也可以呼叫javascript ,如href="javascript:xxx();",文件中推薦這樣寫:<a href=" javascript:void(0)" onclick="xxx();">xx</a>,但是這種方法在複雜環境有時會產生奇怪的問題,儘量不要用javascript:協議做為A的href屬性,這樣不僅會導致不必要的觸發window.onbeforeunload事件,在IE裡面更會使gif動畫圖片停止播放。

點選這樣一個連結時會有兩種情況發生,1、如果dosomthing返回true,那麼瀏覽器就會發生跳轉到cool.html,相反如果返回false的話,就會忽略href。因此借住這個特性,我們可以寫這樣的程式碼......

<a href="cool.html" onclick = "doSomething()">做點什麼吧</a>
function doSomething(){

return confirm("您確認要離開嗎");

}

function doSomething(){

var ret = confirm("確認要離開嗎?");

if(ret){

window.loaction.href = "cool.html";

}

}