阻止a標籤默認行爲的幾種簡單方法

以下簡單總結以下a標籤阻止默認行爲的幾種簡單方法,希望可以對有需要的朋友有些幫助,
(1)   <a href="javascript:void(0);"  onclick= "myjs( )">  Click Me  </a>
onclick方法負責執行js函數,而void是一個操作符,void(0)返回undefined,地址不發生跳轉。
<a href="javascript:;" >  Click Me  </a>

和void(0)一樣,都返回"undefined"


(2) <a href="#">  Click Me   </a>

是網上很常見的代碼,#是標籤內置的一個方法,用這種方法點擊後網頁後返回到頁面的最頂端所以又有了“##”“#!”等,儘管解決了返回頂部的問題但仍存在其他缺陷


(3)事件處理函數的工作機制中,在給某元素添加事件處理函數後,一旦事件發生,相應JavaScript代碼就會執行,所調用的JavaScript代碼的返回值被傳遞給事件處理函數。當我們給a標籤添加onclick事件處理函數並點擊a觸發其後,
如果相應JavaScript代碼返回true,onclick事件處理函數就會認爲這個鏈接唄點擊了,同樣的若返回false即會認爲鏈接
未被點擊
<a href="http://www.baidu.com" onclick=" myjs(); return false; ">   Click Me   </a>  
<a href="http://www.baidu.com" onclick=" return false; ">  Click Me  </a>

當點擊a標籤時,JavaScript代碼返回值爲false,故此鏈接默認行爲未被觸發。


(4)preventDefault()阻止事件的默認行爲但不支持IE,所以在IE中使用returnValue阻止事件默認行爲   
<a href="http://www.baidu.com" id="test">  Click Me  </a> 
<script type="text/javascript"> 
var test = document.getElementById('test'); 
function stopDefault( e )

   if ( e && e.preventDefault ) 
      e.preventDefault(); 
     else 
        window.event.returnValue = false;  

test.onclick = function(e) 

     stopDefault(e); 

</script>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章