国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

細(xì)說(shuō) jQuery 事件篇（六） - 模擬用戶操作

syoya / 3512人閱讀

摘要：查看上方法被觸發(fā)的原因是但是通過(guò)方法直接修改元素的值并不能觸發(fā)事件，只有當(dāng)用戶真實(shí)輸入并改變框的內(nèi)容時(shí)才有效。但是假設(shè)我們希望能模擬用戶的操作，則需要用到方法，修改代碼如下此時(shí)，不需要用戶進(jìn)行點(diǎn)擊操作，通過(guò)已經(jīng)模擬了一次用戶的操作。

前陣子在調(diào)一個(gè) bug 的時(shí)候遇到一個(gè)很坑的問題，在判斷一個(gè)輸入框是否有用戶輸入時(shí)觸發(fā) updateModel 操作，并向后臺(tái)發(fā)送 PUT 請(qǐng)求，結(jié)果調(diào)試時(shí)一直調(diào)不通，最后才發(fā)現(xiàn)的因?yàn)楫?dāng)用戶輸入 # 后系統(tǒng)判斷這是個(gè) tag 標(biāo)簽，因此通過(guò) val 方法直接修改了輸入框的內(nèi)容，而通過(guò) val 方法修改內(nèi)容并不能觸發(fā)綁定在輸入框上的 change 方法。寫個(gè)類似的簡(jiǎn)單例子如下：

jQuery 代碼如下：

  $("input[type="text"]").change(function() {
    alert("input something!");
  })

  $("input[type="text"]").val("test");

上面這段通過(guò) val 直接修改 input 內(nèi)容的方法并不能觸發(fā) change 事件內(nèi)的處理程序 alert。
查看 jQuery API 上 change 方法被觸發(fā)的原因是：

The change event is sent to an element when its value changes.

但是通過(guò) val 方法直接修改元素的值并不能觸發(fā) change 事件，只有當(dāng)用戶真實(shí)輸入并改變 input 框的內(nèi)容時(shí)才有效。當(dāng)時(shí)我的做法是：

 $("input[type="text"]").val("test").change();

但是這種硬改的方法會(huì)顯得代碼有些 hard code。對(duì)于其他情形下，我們需要模擬用戶真實(shí)操作時(shí)應(yīng)該用什么方法進(jìn)行統(tǒng)一處理呢？

模擬用戶操作

假設(shè)我們需要模擬用戶的 click 操作，例如：

jQuery 代碼如下：

  $("button").click(function() {
    alert("click!");//
  })

此時(shí)，如果我們點(diǎn)擊 button 的話，肯定能觸發(fā) alert。但是假設(shè)我們希望能模擬用戶的 click 操作，則需要用到 trigger 方法，修改代碼如下：

  $("button").click(function() {
    alert("click!");//
  })

  $("button").trigger("click");

此時(shí)，不需要用戶進(jìn)行點(diǎn)擊操作，通過(guò) trigger("click") 已經(jīng)模擬了一次用戶的 click 操作。
此時(shí)，再回到剛開始的那個(gè)例子，我們就可以寫成：

 $("input[type="text"]").val("test").trigger("change");

模擬用戶操作也可以應(yīng)用于當(dāng)用戶做出 A 操作時(shí)，模擬出用戶 B 操作，例如虛擬鍵盤，當(dāng)用戶使用鼠標(biāo)點(diǎn)擊虛擬鍵盤上的按鍵時(shí)，模擬用戶鍵盤上的真實(shí)操作。

參考

http://book.douban.com/subject/24669823/

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.specialneedsforspecialkids.com/yun/78164.html

相關(guān)文章

  • 細(xì)說(shuō) jQuery 事件篇（二） - 處理簡(jiǎn)單事件

    摘要：我們可以利用可以對(duì)用戶發(fā)起的事件進(jìn)行處理，這里以樣式轉(zhuǎn)換為例來(lái)說(shuō)明。其他類似的操作事件都可以通過(guò)這個(gè)方法，將處理事件的程序綁定到同名事件上面。 我們可以利用 jQuery 可以對(duì)用戶發(fā)起的事件進(jìn)行處理，這里以樣式轉(zhuǎn)換為例來(lái)說(shuō)明。 增添樣式 基于用戶的事件，對(duì)特定的 DOM 元素樣式進(jìn)行轉(zhuǎn)換是 jQuery 處理事件中比較常見的情形，舉例說(shuō)明，當(dāng)用戶點(diǎn)擊輸入框后，會(huì)增添 highli...

    ckllj 評(píng)論0 收藏0

  • 細(xì)說(shuō) jQuery Ajax操作篇（一） - 數(shù)據(jù)加載

    摘要：同樣將其綁定在按鈕點(diǎn)擊事件上查看結(jié)果為這里需要注意，如果文檔內(nèi)的格式錯(cuò)誤，雖然不會(huì)報(bào)錯(cuò)，但是將無(wú)法執(zhí)行回調(diào)函數(shù)。 Ajax 通俗來(lái)講即不需要刷新頁(yè)面即可從服務(wù)器或客戶端上加載數(shù)據(jù)，當(dāng)然這些數(shù)據(jù)的格式是多種多樣的。 加載 HTML 我們通常使用加載 HTML 的方法來(lái)加載 HTML 片段，并插入到指定位置，假設(shè)當(dāng)前頁(yè)面為： load showImg(http://segmen...

    paulli3 評(píng)論0 收藏0

  • 細(xì)說(shuō) jQuery 事件篇（四） - 改變事件過(guò)程

    摘要：事件對(duì)象是一種結(jié)構(gòu)，它會(huì)在元素獲得處理事件的機(jī)會(huì)時(shí)傳遞給調(diào)用的事件處理程序。事件對(duì)象的屬性指的是事件目標(biāo)，它將保存發(fā)生事件的目標(biāo)元素。所以，接下來(lái)我們就要想辦法改變事件過(guò)程來(lái)阻止這個(gè)行為。 在 《細(xì)說(shuō) jQuery 事件篇（三） - 事件傳播》 中提到了事件冒泡可能造成的弊端，當(dāng)時(shí)舉了 mouseout 的例子，對(duì)于 mouseout 這個(gè)特殊情況，我們可以用 hover 方法來(lái)解決，...

    nifhlheimr 評(píng)論0 收藏0

  • 細(xì)說(shuō) jQuery DOM操作篇（二） - DOM 樹操作

    摘要：此時(shí)，點(diǎn)擊新建的將會(huì)觸發(fā)。設(shè)置元素內(nèi)容的方法則使用上述兩種方法，將新內(nèi)容作為參數(shù)傳遞即可，例如修改上例中的文本內(nèi)容方法同理。 我們知道通過(guò) $() 函數(shù)可以訪問文檔中的元素，并返回一個(gè) jQuery 對(duì)象，并且通過(guò)一系列方法，我們可以修改元素的樣式和內(nèi)容，實(shí)際上，我們還可以通過(guò)該函數(shù)做更多的事情，例如添加、刪除、復(fù)制等操作來(lái)改變 DOM 樹的結(jié)構(gòu)。 創(chuàng)建元素 我們可以通過(guò) $() ...

    Anchorer 評(píng)論0 收藏0

  • 細(xì)說(shuō) jQuery 事件篇（三） - 事件傳播

    摘要：是如何決定由哪個(gè)元素來(lái)處理事件的，以及又是如何優(yōu)化處理這個(gè)問題的，這些都涉及到了事件傳播。事件冒泡的弊端事件冒泡可能會(huì)導(dǎo)致意料之外的行為，例如在響應(yīng)事件時(shí)，依舊是上例，當(dāng)為最外層的添加一個(gè)事件。使用方法可以避免事件傳播導(dǎo)致的問題。 Javascript 是如何決定由哪個(gè)元素來(lái)處理事件的，以及 jQuery 又是如何優(yōu)化處理這個(gè)問題的，這些都涉及到了事件傳播。 事件傳播策略 當(dāng)頁(yè)面內(nèi)...

    Cc_2011 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<