欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Android觸摸事件和mousedown、mouseup、click事件之間的關(guān)系

 更新時(shí)間：2019年01月19日 16:37:26   作者：muzidigbig  
今天小編就為大家分享一篇關(guān)于Android觸摸事件和mousedown、mouseup、click事件之間的關(guān)系，小編覺(jué)得內(nèi)容挺不錯(cuò)的，現(xiàn)在分享給大家，具有很好的參考價(jià)值，需要的朋友一起跟隨小編來(lái)看看吧

一、移動(dòng)端 觸摸事件

ontouchstart、ontouchmove、ontouchend、ontouchcancel

1、Touch事件簡(jiǎn)介

pc上的web頁(yè)面鼠 標(biāo)會(huì)產(chǎn)生onmousedown、onmouseup、onmouseout、onmouseover、onmousemove的事件，但是在移動(dòng)終端如iphone、ipod Touch、ipad上的web頁(yè)面觸屏?xí)r會(huì)產(chǎn)生ontouchstart、ontouchmove、ontouchend、ontouchcancel事件，分別對(duì)應(yīng)了觸屏開(kāi)始、拖拽及完成觸屏事件和取消。

  • 當(dāng)按下手指時(shí)，觸發(fā)ontouchstart；
  • 當(dāng)移動(dòng)手指時(shí)，觸發(fā)ontouchmove；
  • 當(dāng)移走手指時(shí)，觸發(fā)ontouchend。
  • 當(dāng)一些更高級(jí)別的事件發(fā)生的時(shí)候（如電話接入或者彈出信息）會(huì)取消當(dāng)前的touch操作，即觸發(fā)ontouchcancel。一般會(huì)在ontouchcancel時(shí)暫停游戲、存檔等操作。

2、Touch事件與Mouse事件的出發(fā)關(guān)系

在觸屏操作后，手指提起的一剎那（即發(fā)生ontouchend后），系統(tǒng)會(huì)判斷接收到事件的element的內(nèi)容是否被改變，如果內(nèi)容被改變，接下來(lái)的事 件都不會(huì)觸發(fā)，如果沒(méi)有改變，會(huì)按照mousedown，mouseup，click的順序觸發(fā)事件。特別需要提到的是，只有再觸發(fā)一個(gè)觸屏事件時(shí)，才會(huì) 觸發(fā)上一個(gè)事件的mouseout事件。

二、mousedown、mouseup、click事件之間的關(guān)系

點(diǎn)擊select標(biāo)簽元素的時(shí)候，會(huì)彈出下拉。然而當(dāng)option中沒(méi)有元素時(shí)，就不希望彈出下拉（比如在某些瀏覽器中，點(diǎn)擊select會(huì)默認(rèn)出一個(gè)罩層效果，而此時(shí)沒(méi)有數(shù)據(jù)選擇的話，彈出比較不友好）。

首先想到是利用click事件控制，發(fā)現(xiàn)仍然會(huì)有下拉出現(xiàn)...實(shí)際這個(gè)是mousedown事件控制的。

這里就說(shuō)明下click和mousedown、mouseup。規(guī)范要求，只有在同一個(gè)元素上相繼觸發(fā) mousedown 和 mouseup 事件，才會(huì)觸發(fā) click 事件；如果 mousedown 或 mouseup 中的一個(gè)被取消，就不會(huì)觸發(fā) click 事件。

這句話也很好理解，有時(shí)候我們?cè)跒g覽網(wǎng)頁(yè)時(shí)，鼠標(biāo)在一個(gè)按鈕或者鏈接上按下了，但是突然卻又改了主意，此時(shí)我們一般會(huì)移開(kāi)鼠標(biāo)，在另一個(gè)空白處松開(kāi)鼠標(biāo)哈哈~相信這個(gè)大家經(jīng)常上網(wǎng)都有經(jīng)驗(yàn)。實(shí)際這個(gè)就利用了click事件要求在同一個(gè)元素相繼觸發(fā)mousedown 和 mouseup 事件。

<script type="text/javascript">
  var len = 0;
  $('#sel').mousedown(function(){
    if(len == 0){// 模擬一下select標(biāo)簽沒(méi)數(shù)據(jù)的標(biāo)志
      console.log('mousedown');
      return false;
    }
  }).mouseup(function(){
    console.log('mouseup');
  }).click(function(){
    console.log('click');
  });
</script>

點(diǎn)擊后發(fā)現(xiàn)，log的順序是：mousedown-->mouseup-->click

當(dāng)在mousedown中return false后，就不會(huì)彈出下拉或者罩層了...

這里再介紹下鼠標(biāo)的各個(gè)事件：

DOM3 級(jí)事件中定義了9個(gè)鼠標(biāo)事件，簡(jiǎn)介如下。

click：在用戶單擊主鼠標(biāo)按鈕（一般是左邊的按鈕）或者按下回車(chē)鍵時(shí)觸發(fā)。這一點(diǎn)對(duì)確保易訪問(wèn)性很重要，意味著onclick事件處理程序既可以通過(guò)鍵盤(pán)也可以通過(guò)鼠標(biāo)執(zhí)行。

dblclick：在用戶雙擊主鼠標(biāo)按鈕（一般是左邊的按鈕）時(shí)觸發(fā)。從技術(shù)上說(shuō)，這個(gè)事件并不是DOM2級(jí)事件規(guī)范中規(guī)定的，但鑒于它得到了廣泛支持，所以DOM3 級(jí)事件將其納入了標(biāo)準(zhǔn)。

mousedown：在用戶按下了任意鼠標(biāo)按鈕時(shí)觸發(fā)。不能通過(guò)鍵盤(pán)觸發(fā)這個(gè)事件。

mouseenter：在鼠標(biāo)光標(biāo)從元素外部首次移動(dòng)到元素范圍之內(nèi)時(shí)觸發(fā)。這個(gè)事件不冒泡，而且在光標(biāo)移動(dòng)到后代元素上不會(huì)觸發(fā)。DOM2級(jí)事件并沒(méi)有定義這個(gè)事件，但 DOM3級(jí)事件將它納入了規(guī)范。IE、Firefox 9+和 Opera支持這個(gè)事件。

mouseleave：在位于元素上方的鼠標(biāo)光標(biāo)移動(dòng)到元素范圍之外時(shí)觸發(fā)。這個(gè)事件不冒泡，而且在光標(biāo)移動(dòng)到后代元素上不會(huì)觸發(fā)。DOM2級(jí)事件并沒(méi)有定義這個(gè)事件，但 DOM3級(jí)事件將它 納入了規(guī)范。IE、Firefox 9+和 Opera支持這個(gè)事件。

mousemove：當(dāng)鼠標(biāo)指針在元素內(nèi)部移動(dòng)時(shí)重復(fù)地觸發(fā)。不能通過(guò)鍵盤(pán)觸發(fā)這個(gè)事件。

mouseout：在鼠標(biāo)指針位于一個(gè)元素上方，然后用戶將其移入另一個(gè)元素時(shí)觸發(fā)。又移入的另一個(gè)元素可能位于前一個(gè)元素的外部，也可能是這個(gè)元素的子元素。不能通過(guò)鍵盤(pán)觸發(fā)這個(gè)事件。

mouseover：在鼠標(biāo)指針位于一個(gè)元素外部，然后用戶將其首次移入另一個(gè)元素邊界之內(nèi)時(shí)觸 發(fā)。不能通過(guò)鍵盤(pán)觸發(fā)這個(gè)事件。

mouseup：在用戶釋放鼠標(biāo)按鈕時(shí)觸發(fā)。不能通過(guò)鍵盤(pán)觸發(fā)這個(gè)事件。 頁(yè)面上的所有元素都支持鼠標(biāo)事件。除了 mouseenter 和 mouseleave，所有鼠標(biāo)事件都會(huì)冒泡， 也可以被取消，而取消鼠標(biāo)事件將會(huì)影響瀏覽器的默認(rèn)行為。取消鼠標(biāo)事件的默認(rèn)行為還會(huì)影響其他事 件，因?yàn)槭髽?biāo)事件與其他事件是密不可分的關(guān)系。

若有不足請(qǐng)多多指教！希望給您帶來(lái)幫助！

總結(jié)

以上就是這篇文章的全部?jī)?nèi)容了，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，謝謝大家對(duì)腳本之家的支持。如果你想了解更多相關(guān)內(nèi)容請(qǐng)查看下面相關(guān)鏈接

相關(guān)文章

最新評(píng)論