-
通過change事件去監(jiān)聽這些改變的動作查看全部
-
$("p").hover( function() { $(this).css("background", 'red');//enter效果 }, function() { $(this).css("background", '#bbffaa');//leave效果 } );查看全部
-
e為事件對象，是用來記錄一些事件發(fā)生時的相關(guān)信息的對象。事件對象只有事件發(fā)生時才會產(chǎn)生，并且只能是事件處理函數(shù)內(nèi)部訪問，在所有事件處理函數(shù)運行結(jié)束后，事件對象即被銷毀。查看全部
-
mousemove的快捷方法可以監(jiān)聽用戶移動的的操作查看全部
-
mousedown強調(diào)是按下觸發(fā) 如果在一個元素按住了鼠標(biāo)不放，并且拖動鼠標(biāo)離開這個元素，并釋放鼠標(biāo)鍵，這仍然是算作mousedown事件 任何鼠標(biāo)按鈕被按下時都能觸發(fā)mousedown事件 用event 對象的which區(qū)別按鍵，敲擊鼠標(biāo)左鍵which的值是1，敲擊鼠標(biāo)中鍵which的值是2，敲擊鼠標(biāo)右鍵which的值是3 mouseup強調(diào)是松手觸發(fā)，與mousedown是相反的 mouseup與mousedown組合起來就是click事件 如果用戶在一個元素上按下鼠標(biāo)按鍵，并且拖動鼠標(biāo)離開這個元素，然后釋放鼠標(biāo)鍵，這仍然是算作mouseup事件 任何鼠標(biāo)按鈕松手時都能觸發(fā)mouseup事件 用event 對象的which區(qū)別按鍵，敲擊鼠標(biāo)左鍵which的值是1，敲擊鼠標(biāo)中鍵which的值是2，敲擊鼠標(biāo)右鍵which的值是3查看全部
-
mousedown的快捷方法可以監(jiān)聽用戶鼠標(biāo)按下的操作，與其對應(yīng)的還有一個方法mouseup快捷方法可以監(jiān)聽用戶鼠標(biāo)彈起的操作查看全部
-
jQuery表單事件之submit事件 提交表單是一個最常見的業(yè)務(wù)需求，比如用戶注冊，一些信息的輸入都是需要表單的提交。同樣的有時候開發(fā)者需要在表單提交的時候過濾一些的數(shù)據(jù)、做一些必要的操作（例如：驗證表單輸入的正確性，如果錯誤就阻止提交，從新輸入）此時可以通過submit事件，監(jiān)聽下提交表單的這個動作 使用上非常簡單，與基本事件參數(shù)處理保持一致 方法一：$ele.submit() 綁定$ele元素，不帶任何參數(shù)一般是用來指定觸發(fā)一個事件，用的比較少 <div id="test">點擊觸發(fā)<div> $("ele").submit(function(){ alert('觸發(fā)指定事件') }) $("#text").click(function(){ $("ele").submit() //指定觸發(fā)事件 }); 方法二：$ele.submit( handler(eventObject) ) 綁定$ele元素，每次$ele元素觸發(fā)點擊操作會執(zhí)行回調(diào) handler函數(shù) 這樣可以針對事件的反饋做很多操作了 <form id="target" action="destination.html"> <input type="submit" value="Go" /> </form> $("#target").submit(function() { //綁定提交表單觸發(fā) //this指向 from元素 }); 方法三：$ele.submit( [eventData ], handler(eventObject) ) 使用與方法二一致，不過可以接受一個數(shù)據(jù)參數(shù)，這樣的處理是為了解決不同作用域下數(shù)據(jù)傳遞的問題 <form id="target" action="destination.html"> <input type="submit" value="Go" /> </form> $("#target").submit(11111,function(data) { //綁定提交表單觸發(fā) //data => 1111 //傳遞的data數(shù)據(jù) }); 通過在<form>元素上綁定submit事件，開發(fā)者可以監(jiān)聽到用戶的提交表單的的行為查看全部
-
jQuery表單事件之select事件 當(dāng) textarea 或文本類型的 input 元素中的文本被選擇時，會發(fā)生 select 事件。 這個函數(shù)會調(diào)用執(zhí)行綁定到select事件的所有函數(shù)，包括瀏覽器的默認行為?？梢酝ㄟ^在某個綁定的函數(shù)中返回false來防止觸發(fā)瀏覽器的默認行為。 select事件只能用于<input>元素與<textarea>元素 使用上非常簡單： 方法一：.select() 觸發(fā)元素的select事件: $("input").select(); 方法二：$ele.select( handler(eventObject) ) 綁定$ele元素，每次$ele元素觸發(fā)點擊操作會執(zhí)行回調(diào) handler函數(shù) 這樣可以針對事件的反饋做很多操作了 <input id="test" value="文字選中"></input> $("#test").select(function() { //響應(yīng)文字選中回調(diào) //this指向 input元素 }); 方法三：$ele.select( [eventData ], handler(eventObject) ) 使用與方法二一致，不過可以接受一個數(shù)據(jù)參數(shù)，這樣的處理是為了解決不同作用域下數(shù)據(jù)傳遞的問題 <input id="test" value="文字選中"></input> $("#test").select(11111,function(e) {//響應(yīng)文字選中回調(diào) //this指向 div元素 //e.data => 11111 傳遞數(shù)據(jù) });查看全部
-
jQuery表單事件之change事件 <input>元素，<textarea>和<select>元素的值都是可以發(fā)生改變的，開發(fā)者可以通過change事件去監(jiān)聽這些改變的動作 input元素 監(jiān)聽value值的變化，當(dāng)有改變時，失去焦點后觸發(fā)change事件。對于單選按鈕和復(fù)選框，當(dāng)用戶用鼠標(biāo)做出選擇時，該事件立即觸發(fā)。 select元素 對于下拉選擇框，當(dāng)用戶用鼠標(biāo)作出選擇時，該事件立即觸發(fā) textarea元素 多行文本輸入框，當(dāng)有改變時，失去焦點后觸發(fā)change事件 change事件很簡單，無非就是注意下觸發(fā)的先后行為，可以看看右邊代碼參考查看全部
-
jQuery表單事件之blur與focus事件 在之前2.8與2.9節(jié)我們學(xué)過了表單處理事件focusin事件與focusout事件，同樣用于處理表單焦點的事件還有blur與focus事件 它們之間的本質(zhì)區(qū)別: 是否支持冒泡處理 舉個簡單的例子 <div> <input type="text" /> </div> 其中input元素可以觸發(fā)focus()事件 div是input的父元素，當(dāng)它包含的元素input觸發(fā)了focus事件時，它就產(chǎn)生了focusin()事件。 focus()在元素本身產(chǎn)生，focusin()在元素包含的元素中產(chǎn)生 blur與focusout也亦是如此 具體參考下案例，給出來的區(qū)別查看全部
-
jQuery鼠標(biāo)事件之focusout事件 當(dāng)一個元素，或者其內(nèi)部任何一個元素失去焦點的時候，比如input元素，用戶在點擊失去焦的時候，如果開發(fā)者需要捕獲這個動作，jQuery提供了一個focusout事件 使用上非常簡單： 方法一：$ele.focusout() 綁定$ele元素，不帶任何參數(shù)一般是用來指定觸發(fā)一個事件，可能一般用的比較少 <div id="test">點擊觸發(fā)<div> $("ele").focusout(function(){ alert('觸發(fā)指定事件') }) $("#test").mouseup(function(){ $("ele").focusout() //指定觸發(fā)事件 }); 方法二：$ele.focusout( handler ) 綁定$ele元素，每次$ele元素觸發(fā)點擊操作會執(zhí)行回調(diào) handler函數(shù) 這樣可以針對事件的反饋做很多操作了 <div id="test">點擊觸發(fā)<div> $("#test").focusout(function() { //this指向 div元素 }); 方法三：$ele.focusout( [eventData ], handler ) 使用與方法二一致，不過可以接受一個數(shù)據(jù)參數(shù)，這樣的處理是為了解決不同作用域下數(shù)據(jù)傳遞的問題 <div id="test">點擊觸發(fā)<div> $("#test").focusout(11111,function(e) { //this指向 div元素 //e.data => 11111 傳遞數(shù)據(jù) });查看全部
-
jQuery鼠標(biāo)事件之focusin事件 當(dāng)一個元素，或者其內(nèi)部任何一個元素獲得焦點的時候，例如：input元素，用戶在點擊聚焦的時候，如果開發(fā)者需要捕獲這個動作的時候，jQuery提供了一個focusin事件 使用上非常簡單： 方法一：$ele.focusin() 綁定$ele元素，不帶任何參數(shù)一般是用來指定觸發(fā)一個事件，一般用的比較少 <div id="test">點擊觸發(fā)<div> $("ele").focusin(function(){ alert('觸發(fā)指定事件') }) $("#test").mouseup(function(){ $("ele").focusin() //指定觸發(fā)事件 }); 方法二：$ele.focusin( handler ) 綁定$ele元素，每次$ele元素觸發(fā)點擊操作會執(zhí)行回調(diào) handler函數(shù) 這樣可以針對事件的反饋做很多操作了 <div id="test">點擊觸發(fā)<div> $("#test").focusin(function() { //this指向 div元素 }); 方法三：$ele.focusin( [eventData ], handler ) 使用與方法二一致，不過可以接受一個數(shù)據(jù)參數(shù)，這樣的處理是為了解決不同作用域下數(shù)據(jù)傳遞的問題 <div id="test">點擊觸發(fā)<div> $("#test").focusin(11111,function(e) { //this指向 div元素 //e.data => 11111 傳遞數(shù)據(jù) });查看全部
-
jQuery鼠標(biāo)事件之mouseenter與mouseleave事件 用交互操作中，經(jīng)常需要知道用戶操作鼠標(biāo)是否有移到元素內(nèi)部或是元素外部，因此jQuery提供了一個mouseenter和mouseleave的快捷方法可以監(jiān)聽用戶移動到內(nèi)部的操作 使用上非常簡單，三種參數(shù)傳遞方式與mouseover和mouseout是一模一樣的，所以這里不再重復(fù)，主要講講區(qū)別，下面以mouseenter為例： mouseenter JavaScript事件是Internet Explorer專有的。由于該事件在平時很有用，jQuery的模擬這一事件，以便它可用于所有瀏覽器。該事件在鼠標(biāo)移入到元素上時被觸發(fā)。任何HTML元素都可以接受此事件。 mouseenter事件和mouseover的區(qū)別 關(guān)鍵點就是：冒泡的方式處理問題 簡單的例子： mouseover為例： <div class="aaron2"> <p>鼠標(biāo)離開此區(qū)域觸發(fā)mouseleave事件</p> </div> 如果在p元素與div元素都綁定mouseover事件，鼠標(biāo)在離開p元素，但是沒有離開div元素的時候，觸發(fā)的結(jié)果: p元素響應(yīng)事件 div元素響應(yīng)事件 這里的問題是div為什么會被觸發(fā)？ 原因就是事件冒泡的問題，p元素觸發(fā)了mouseover，他會一直往上找父元素上的mouseover事件，如果父元素有mouseover事件就會被觸發(fā) 所以在這種情況下面，jQuery推薦我們使用 mouseenter事件 mouseenter事件只會在綁定它的元素上被調(diào)用，而不會在后代節(jié)點上被觸發(fā)查看全部
-
jQuery鼠標(biāo)事件之mouseover與mouseout事件 在學(xué)JS的時候，大家還記得有兩個方法叫移入移出事件嗎？onmouseover()與onmouseout()事件~ jQuery當(dāng)中同樣提供了這樣的事件來監(jiān)聽用戶的移入移出操作，mouseover()與mouseout()事件，兩者用法類似，下面一mouseover為例： 方法一：$ele.mouseover() 綁定$ele元素，不帶任何參數(shù)一般是用來指定觸發(fā)一個事件，用的比較少 <div id="test">點擊觸發(fā)<div> $("ele").mouseover(function(){ alert('觸發(fā)指定事件') }) $("#test").click(function(){ $("ele").mouseover() //指定觸發(fā)事件 }); 方法二：$ele.mouseover( handler(eventObject) ) 綁定$ele元素，每次$ele元素觸發(fā)點擊操作會執(zhí)行回調(diào) handler函數(shù) 這樣可以針對事件的反饋做很多操作了 <div id="test">滑動觸發(fā)<div> $("#test").mouseover(function() { //this指向 div元素 }); 方法三：$ele.mouseover( [eventData ], handler(eventObject) ) 使用與方法二一致，不過可以接受一個數(shù)據(jù)參數(shù)，這樣的處理是為了解決不同作用域下數(shù)據(jù)傳遞的問題 <div id="test">點擊觸發(fā)<div> $("#test").mouseover(11111,function(e) { //this指向 div元素 //e.data => 11111 傳遞數(shù)據(jù) });查看全部
-
jQuery鼠標(biāo)事件之mousemove事件 用交互操作中，經(jīng)常需要知道用戶是否有移動的操作?；谝苿拥臋C制可以做出拖動、拖拽一系列的效果出來。針對移動事件，jQuery提供了一個mousemove的快捷方法可以監(jiān)聽用戶移動的的操作 使用上非常簡單： 方法一：$ele.mousemove() 綁定$ele元素，不帶任何參數(shù)一般是用來指定觸發(fā)一個事件，用的比較少 <div id="test">點擊觸發(fā)<div> $("ele").mousemove(function(){ alert('觸發(fā)指定事件') }) $("#test").click(function(){ $("ele").mousemove() //指定觸發(fā)事件 }); 方法二：$ele.mousemove( handler(eventObject) ) 綁定$ele元素，每次$ele元素觸發(fā)點擊操作會執(zhí)行回調(diào) handler函數(shù) 這樣可以針對事件的反饋做很多操作了 <div id="test">滑動觸發(fā)<div> $("#test").mousemove(function() { //this指向 div元素 }); 方法三：$ele.mousemove( [eventData ], handler(eventObject) ) 使用與方法二一致，不過可以接受一個數(shù)據(jù)參數(shù)，這樣的處理是為了解決不同作用域下數(shù)據(jù)傳遞的問題 <div id="test">點擊觸發(fā)<div> $("#test").mousemove(11111,function(e) { //this指向 div元素 //e.data => 11111 傳遞數(shù)據(jù) });查看全部
舉報
0/150
提交
取消