Javascript和jquery事件--點擊事件和觸發超鏈接


前面的不過是一些基礎的知識,真正的一些事件還是有點不同。還有一些命名空間的問題。不過現在ie也開始接受W3C標准,而且平時開發也很少考慮ie了,一些事件就不考慮ie了。

點擊事件--click

  大部分問題出現在js、jq觸發超鏈接上面。我之前看到的解釋是谷歌新版本阻止了觸發瀏覽器默認的操作(超鏈接、右鍵等等),但是在下面參考的一篇文章又提出是因為要觸發超鏈接點擊的不是<a>元素,而是<a>元素里面的內容,我覺得比較靠譜,因為網上不少jq有關操作做的都是相關的改變,但是這個方法在js中無用,大致的方法有如下幾種。

在Js中:

    a)  無法觸發超鏈接,只觸發了給a標簽綁定的’click’監聽器(標准方法)

var evt = document.createEvent( 'HTMLEvents' );

evt.initEvent('click', true, true);

document.getElementById('test').dispatchEvent(evt);//無法觸發超鏈接a

 

    b)  給a標簽里面添加了一個空的<span></span>,然后使用相同方法不可以觸發

document.getElementById('test').childNodes[0].dispatchEvent(evt);//無法觸發超鏈接a

 

    c) 使用MouseEvent可以觸發,不太清楚MouseEvents和event的區別。

var event = document.createEvent('MouseEvents');

event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);

document.getElementById('test').dispatchEvent(event);//可以觸發超鏈接a

    

    d) 使用click()可以觸發,這個我是真的不明白了,網上也還沒有查到更多的解釋,無論在js還是jq,好像它就理所當然地可以代替addEventListener進行監聽器綁定,然而又區別於onclick,然后又理所當然地可以替代dispatchEvent()進行事件觸發,而且不受是不是超鏈接限制。我之前用的最多的也是它,也有一些與它相似的事件,大概都出現在表單元素中,到時候再統一看看。

document.getElementById('test').click();//可以觸發超鏈接a

在jq中:

    a) 無法觸發超鏈接,只觸發了給a標簽綁定的’click’監聽器(標准方法)

$('#test').trigger('click');//無法觸發超鏈接a

 

    b) 給a標簽里面添加了一個空的<span></span>,然后使用相同方法可以觸發

$('#test span').trigger('click');//可以觸發超鏈接a

 

  c) 依舊是click()觸發,不過除了js中的疑問,又多了一個疑問。由於之前所說是點擊內容觸發,$(‘#test’).click();不能觸發,$(‘#test’)[0].click()能觸發,即使#test對應的a標簽沒有子元素我都能理解。但是我依稀記得引發我對超鏈接思考的事故就發生在$a[0].click()失效啊。

我回去看了一下,下面的一段代碼在http訪問火狐瀏覽器的確是無效的,我也不知道為什么,反正就是不能用。

        

var $a = $("<a></a>").attr("href", 'worker.js').attr('target','_blank');

 $a[0].click();//在火狐瀏覽器中通過http訪問時無效

 

參考:

http://www.cnblogs.com/kevinge/p/4803786.html

https://smartblack.iteye.com/blog/608477


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM