瀏覽器事件的思考

2022-10-05 05:51:08 字數 1000 閱讀 3117

先看下面的**:

var $ = kissy.all;

$(『a』).on(『click』,function(e) else e程式設計客棧lse {

//否則,我們需要使用ie的方式來取消事件冒泡

window.event.cancelbubble = true;

return false;

不是吧,我寫最開始的**只是想阻止瀏覽器的預設行為,不需要取消事件冒泡。

但是,這樣寫也沒有什麼問題啊!(嘴硬,**……)。

確實,大多數情況下,這樣的**沒有任何問題,那如果我們把這段**放大到乙個大環境中,會出現什麼狀況

teaser text.。.

teaser text.。.

現在假設我們想要在使用者點選文章標題時,將文章動態載入到div.content中(也就是dosomething做的事情),

哈哈:上文的js**也還是會執行啊(年輕人太急)。

我們順著這個思路繼續,如果我想要在使用者點選了乙個div.post元素(或者任何乙個它的子元素)時,給它加上乙個active類,我就需要給div.post繫結click

var posts 程式設計客棧= $(『div.post』);

posts.on(『click』,function () {

posts.removeclass(「active」);

$(this).addclass(「active」);

這個**就會有時候執行有時候不執行,因為你在點選a的時候取消了事件冒泡。

我們把這個**的執行範圍再次放大,產品提了乙個需求,要求監聽頁面上所有的點選情況,乙個同學接到需求,開心的在document上用了事件**,向服務端傳送了資料,回頭資料一統計,似乎少了什麼。回頭一看,有人在a標籤的點選事件中用了halt。

其實這就是本文想傳遞的資訊,大多數情況下,當你使用halt時,你其實真正需要的是e.preventdefault(),在你寫通用的元件時候這個問題尤其突出。

文:本文標題: 瀏覽器事件的思考

本文位址:

瀏覽器事件

常用瀏覽器事件與dom事件,包括滑鼠事件 鍵盤事件 框架 物件事件 表單事件 剪貼簿事件 列印事件 拖動事件 多 事件 動畫事件 過渡事件。onbeforeinstallprompt 當使用者即將被提示安裝web應用程式時,該處理程式將在裝置上排程,其相關聯的事件可以儲存以供稍後用於在更適合的時間提...

瀏覽器事件

常用瀏覽器事件與dom事件,包括滑鼠事件 鍵盤事件 框架 物件事件 表單事件 剪貼簿事件 列印事件 拖動事件 多 事件 動畫事件 過渡事件。onbeforeinstallprompt 當使用者即將被提示安裝web應用程式時,該處理程式將在裝置上排程,其相關聯的事件可以儲存以供稍後用於在更適合的時間提...

瀏覽器的事件

1 獲取瀏覽器的可視視窗 var w document.documentelement.clientwidth document.body.clientwidth var h document.documentelement.clientheight document.body.clientheig...