分享兩個容易忽視的細(xì)節(jié):
1.keydown事件第一次觸發(fā)很多人都知道觸發(fā)在前同步在后。這只是個猜測,我做了下測試:在回調(diào)函數(shù)后面添加代碼:console.log(1);return false。再次按下按鍵,console里打印了數(shù)據(jù)1,但是文本框沒有值輸入,說明keydown事件在游覽器默認(rèn)行為之前觸發(fā)。所以大家的猜想是正確的。
2.關(guān)于長按按鍵,keydown事件會不斷觸發(fā)的解釋。這是W3C標(biāo)準(zhǔn)的規(guī)范,原始設(shè)計就是這樣。之所以這樣設(shè)計,有幾個考慮:1.為了復(fù)合鍵的操作需求,如ctrl+s。2.為了空格鍵,方向鍵等按鍵長按更具操作性的需求。要避免連續(xù)觸發(fā)可以keydown,keyup連用。
1.keydown事件第一次觸發(fā)很多人都知道觸發(fā)在前同步在后。這只是個猜測,我做了下測試:在回調(diào)函數(shù)后面添加代碼:console.log(1);return false。再次按下按鍵,console里打印了數(shù)據(jù)1,但是文本框沒有值輸入,說明keydown事件在游覽器默認(rèn)行為之前觸發(fā)。所以大家的猜想是正確的。
2.關(guān)于長按按鍵,keydown事件會不斷觸發(fā)的解釋。這是W3C標(biāo)準(zhǔn)的規(guī)范,原始設(shè)計就是這樣。之所以這樣設(shè)計,有幾個考慮:1.為了復(fù)合鍵的操作需求,如ctrl+s。2.為了空格鍵,方向鍵等按鍵長按更具操作性的需求。要避免連續(xù)觸發(fā)可以keydown,keyup連用。
2018-03-21
事件冒泡 :當(dāng)一個元素接收到事件的時候 會把他接收到的事件傳給自己的父級,一直到window 。(注意這里傳遞的僅僅是事件 并不傳遞所綁定的事件函數(shù)。所以如果父級沒有綁定事件函數(shù),就算傳遞了事件 也不會有什么表現(xiàn) 但事件確實傳遞了。)
相信很多人學(xué)到這對冒泡事件會是一頭霧水。很多人吐槽老師語文不過關(guān),教學(xué)方式奇特。一開始我是反對的,因為我都看得懂。(其實我主要都是自己研究老師寫的代碼和反復(fù)做實驗來感受代碼的特性,并沒多大咬文嚼字,學(xué)習(xí)文字傳遞的東西)但是到冒泡這邊就有點蒙了,比較抽象,很難通過實驗找出特性。網(wǎng)上無意間看到某大佬對冒泡件事的解釋,這才發(fā)現(xiàn)Aaron老師絕對是個地道的理科生?。?!
相信很多人學(xué)到這對冒泡事件會是一頭霧水。很多人吐槽老師語文不過關(guān),教學(xué)方式奇特。一開始我是反對的,因為我都看得懂。(其實我主要都是自己研究老師寫的代碼和反復(fù)做實驗來感受代碼的特性,并沒多大咬文嚼字,學(xué)習(xí)文字傳遞的東西)但是到冒泡這邊就有點蒙了,比較抽象,很難通過實驗找出特性。網(wǎng)上無意間看到某大佬對冒泡件事的解釋,這才發(fā)現(xiàn)Aaron老師絕對是個地道的理科生?。?!
2018-03-20
$(".aaron1").mousemove(function(e) {
$(this).find('p:last').html('移動的X位置:' + (parseInt(e.pageX)-13)+'</br>'+'移動的Y位置:'+ (parseInt(e.pageY)-189))
})
測試二修改了一下,變成定位鼠標(biāo)在div里面的X/Y坐標(biāo)位置~
$(this).find('p:last').html('移動的X位置:' + (parseInt(e.pageX)-13)+'</br>'+'移動的Y位置:'+ (parseInt(e.pageY)-189))
})
測試二修改了一下,變成定位鼠標(biāo)在div里面的X/Y坐標(biāo)位置~
2018-03-19
$("li").on('click',function(){
alert('觸發(fā)的元素是內(nèi)容是: ' + this.textContent)
})
我習(xí)慣用這種方法,冒泡有時候要搞混
alert('觸發(fā)的元素是內(nèi)容是: ' + this.textContent)
})
我習(xí)慣用這種方法,冒泡有時候要搞混
2018-03-19
$('#elem').on('Aaron', function(event,arg1,arg2) {
alert("自觸自定義時間")
});
$('#elem').trigger('Aaron',['參數(shù)1','參數(shù)2'])
個人理解更像是在動態(tài)的給$('#elem')這個對象增加方法。
對象已經(jīng)實例化后還可以再增加方法,這點不同于其他語言
alert("自觸自定義時間")
});
$('#elem').trigger('Aaron',['參數(shù)1','參數(shù)2'])
個人理解更像是在動態(tài)的給$('#elem')這個對象增加方法。
對象已經(jīng)實例化后還可以再增加方法,這點不同于其他語言
2018-03-11
冒泡現(xiàn)象~感覺是底層沒有實現(xiàn)好造成的~
剛百度了一下谷歌瀏覽器的js引擎是C語言寫的,所以冒泡現(xiàn)象因該跟C的繼承原理有關(guān)
猜想js引擎里面父元素和子元素都是調(diào)用的基類指針,所以該指針會調(diào)用到父類的方法。
父元素、子元素統(tǒng)一調(diào)用基類指針可以省很多事情,大大提高效率,但是帶來了冒泡現(xiàn)象
如果js引擎用C++寫的估計能夠避免冒泡現(xiàn)象,因為C++具有多態(tài)性,而C沒有多態(tài)。
剛百度了一下谷歌瀏覽器的js引擎是C語言寫的,所以冒泡現(xiàn)象因該跟C的繼承原理有關(guān)
猜想js引擎里面父元素和子元素都是調(diào)用的基類指針,所以該指針會調(diào)用到父類的方法。
父元素、子元素統(tǒng)一調(diào)用基類指針可以省很多事情,大大提高效率,但是帶來了冒泡現(xiàn)象
如果js引擎用C++寫的估計能夠避免冒泡現(xiàn)象,因為C++具有多態(tài)性,而C沒有多態(tài)。
2018-03-09
bottonName=bottonName||'first' 剛開始沒接觸過這種類型的變量賦值??丛u論之后恍然大悟。
2018-03-07
不少人說:在這里keydown的行為是同步行為,事實上并非如此。在按下鍵盤按鍵后數(shù)值還沒有到達(dá)文本框而keydown事件已經(jīng)觸發(fā)。故達(dá)到的值應(yīng)是按鍵之前的屬性值。
2018-03-06
function data(e) { alert(e.data) }
function a() {$("button:eq(2)").click(1111, data) }a();
這段代碼會在加載到這里時,開始調(diào)用a()函數(shù),為第三個button添加單擊事件,并為單擊事件的回調(diào)函數(shù)data()傳入一個參數(shù)‘1111’
‘1111’這個參數(shù)在傳入后,會被作為e的初始化值,生成JS事件對象e(event)。所以在data函數(shù)中,可以調(diào)用事件對象的方法 '.data'獲取該事件對象的數(shù)據(jù)。因為該事件對象e是a()函數(shù)里的‘1111’初始化的,所以e調(diào)用.data方法獲取到的數(shù)據(jù)也自然是‘1111’
function a() {$("button:eq(2)").click(1111, data) }a();
這段代碼會在加載到這里時,開始調(diào)用a()函數(shù),為第三個button添加單擊事件,并為單擊事件的回調(diào)函數(shù)data()傳入一個參數(shù)‘1111’
‘1111’這個參數(shù)在傳入后,會被作為e的初始化值,生成JS事件對象e(event)。所以在data函數(shù)中,可以調(diào)用事件對象的方法 '.data'獲取該事件對象的數(shù)據(jù)。因為該事件對象e是a()函數(shù)里的‘1111’初始化的,所以e調(diào)用.data方法獲取到的數(shù)據(jù)也自然是‘1111’
2018-03-05
var i = 0;
$(".aaron1 p").mouseover(function(e) {
$(".aaron1 a:first").html('mouseover事件觸發(fā)次數(shù):' + (++i))
})
var n = 0;
$(".aaron1").mouseover(function() {
$(".aaron1 a:last").html('mouseover冒泡事件觸發(fā)次數(shù):' + (++n))
})
$(".aaron1 p").mouseover(function(e) {
$(".aaron1 a:first").html('mouseover事件觸發(fā)次數(shù):' + (++i))
})
var n = 0;
$(".aaron1").mouseover(function() {
$(".aaron1 a:last").html('mouseover冒泡事件觸發(fā)次數(shù):' + (++n))
})
2018-03-05
function a() {
$("button:eq(2)").click(1111, data)
// }
// a();啥意思
$("button:eq(2)").click(1111, data)
// }
// a();啥意思
2018-03-05