js - 玖 、事件

一捣域、單擊事件

onclick:??鼠標(biāo)的單擊事件

方式一:??獲取元素逾条,在js中給元素綁定

btn.onclick?=?function(){? ? ? ?

?}

方式二:?定義好函數(shù)琢岩,?在html標(biāo)簽中?綁定函數(shù)

function?myClick(){

?}

二、鍵盤事件

onkeydown:??用戶按下鍵位的時候觸發(fā)

onkeyup?:???用戶抬起鍵位時

onkeypress:?用戶按下該鍵位?再抬起時觸發(fā)


備注:event對象:?表示事件源本身(我們在使用的時候师脂,以形參的形式來使用担孔,實參由事件本身傳遞

使用時江锨,一定符合見名知意:?例如:?event??ev??evt??e)

event相關(guān):

ev.target?:??返回?事件源

ev.button: 返回鼠標(biāo)被按下的那個鍵

ev.offsetX?:??鼠標(biāo)在元素上?X軸的位置

ev.clientX:?鼠標(biāo)?在瀏覽器可視區(qū)域?x軸上的位置(左邊距)

ev.clientY:?鼠標(biāo)?在瀏覽器可視區(qū)域?y軸上的位置(上邊距)

ev.keyCode?:?返回鍵盤的編碼,以此來確定是哪個鍵位(keyCode:?鍵盤編碼)

三糕篇、事件類型

onload?:?當(dāng)頁面(html,圖片之類)加載完成后啄育,執(zhí)行的方法

onblur:?失去焦點

onfocus:?獲得焦點

onselect:?選中文本時觸發(fā)

onchange:?在內(nèi)容發(fā)生改變是觸發(fā)

onreset:?重置時觸發(fā)

ondblclick:?雙擊時觸發(fā)

onmousedown?:??用戶在指定元素身上?按下時觸發(fā)

四、事件監(jiān)聽:

?addEventListener()

參數(shù)1?:?事件類型

參數(shù)2?:?觸發(fā)事件后執(zhí)行的函數(shù)

參數(shù)3?:?布爾值???默認(rèn)值是?false?事件冒泡??拌消;???true?事件捕獲

????gf.addEventListener("click",function?abc(ev)?{

????????console.log("3");

????},false);

普通事件綁定和?事件監(jiān)聽的區(qū)別:

? ? 1.?普通的只能給元素相同類型的事件綁定一個挑豌,如果綁定相同的第二個,會將上一個覆蓋事件監(jiān)聽可以給 同一個元素的相同類型事件綁定多個

? ? 2.?事件監(jiān)聽可以控制事件的傳播方式(冒泡或捕獲)

? ? 3.?事件監(jiān)聽可以通過刪除的方法墩崩,來取消事件氓英,而普通綁定只能通過?null來取消

五、事件委托

原理:事件冒泡

六鹦筹、選項卡

for(var?j?=?0?;?j?<?but.length;?j++){

? ? ? ? ? but[j].index?=?j;

? ? ? ? ? but[j].onclick?=?function(){

(1.將所有div隱藏)

? ? ? ? ? ?for(var?i?=?0;?i?<?box.length;?i++){

? ? ? ? ? ? ? ? ?box[i].style.display?=?"none";

? ? ? ? ? ?}

(2.將指定的元素顯示

????????????????????box[this.index].style.display?=?"block";

? ?}

?}

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末铝阐,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子铐拐,更是在濱河造成了極大的恐慌徘键,老刑警劉巖,帶你破解...
    沈念sama閱讀 222,590評論 6 517
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件遍蟋,死亡現(xiàn)場離奇詭異啊鸭,居然都是意外死亡,警方通過查閱死者的電腦和手機匿值,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,157評論 3 399
  • 文/潘曉璐 我一進(jìn)店門赠制,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人挟憔,你說我怎么就攤上這事钟些。” “怎么了绊谭?”我有些...
    開封第一講書人閱讀 169,301評論 0 362
  • 文/不壞的土叔 我叫張陵政恍,是天一觀的道長。 經(jīng)常有香客問我达传,道長篙耗,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 60,078評論 1 300
  • 正文 為了忘掉前任宪赶,我火速辦了婚禮宗弯,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘搂妻。我一直安慰自己蒙保,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 69,082評論 6 398
  • 文/花漫 我一把揭開白布欲主。 她就那樣靜靜地躺著邓厕,像睡著了一般逝嚎。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上详恼,一...
    開封第一講書人閱讀 52,682評論 1 312
  • 那天补君,我揣著相機與錄音,去河邊找鬼昧互。 笑死赚哗,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的硅堆。 我是一名探鬼主播屿储,決...
    沈念sama閱讀 41,155評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼渐逃!你這毒婦竟也來了够掠?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 40,098評論 0 277
  • 序言:老撾萬榮一對情侶失蹤茄菊,失蹤者是張志新(化名)和其女友劉穎疯潭,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體面殖,經(jīng)...
    沈念sama閱讀 46,638評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡竖哩,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,701評論 3 342
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了脊僚。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片相叁。...
    茶點故事閱讀 40,852評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖辽幌,靈堂內(nèi)的尸體忽然破棺而出增淹,到底是詐尸還是另有隱情,我是刑警寧澤乌企,帶...
    沈念sama閱讀 36,520評論 5 351
  • 正文 年R本政府宣布虑润,位于F島的核電站,受9級特大地震影響加酵,放射性物質(zhì)發(fā)生泄漏拳喻。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 42,181評論 3 335
  • 文/蒙蒙 一猪腕、第九天 我趴在偏房一處隱蔽的房頂上張望冗澈。 院中可真熱鬧,春花似錦码撰、人聲如沸渗柿。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,674評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽朵栖。三九已至,卻和暖如春柴梆,著一層夾襖步出監(jiān)牢的瞬間陨溅,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,788評論 1 274
  • 我被黑心中介騙來泰國打工绍在, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留门扇,地道東北人。 一個月前我還...
    沈念sama閱讀 49,279評論 3 379
  • 正文 我出身青樓偿渡,卻偏偏與公主長得像臼寄,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子溜宽,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,851評論 2 361

推薦閱讀更多精彩內(nèi)容

  • 事件流分為兩種吉拳,捕獲事件流和冒泡時間流 捕獲事件流:從根節(jié)點出發(fā)開始執(zhí)行,一直往子節(jié)點查找執(zhí)行适揉,直到查到到根節(jié)點留攒。...
    路上靈魂的自由者閱讀 397評論 0 0
  • ??JavaScript 與 HTML 之間的交互是通過事件實現(xiàn)的炼邀。 ??事件,就是文檔或瀏覽器窗口中發(fā)生的一些特...
    霜天曉閱讀 3,503評論 1 11
  • dom事件 1.什么是事件剪侮?事件就是一件事情或者行為(對于元素來說他的很多事件都是天生自帶)只要我們?nèi)ゲ僮鬟@個元素...
    田成力閱讀 605評論 0 0
  • 一拭宁、DOM 什么是DOM?Document Object Model(文檔對象模型)瓣俯。DOM是針對HTML和XML...
    空谷悠閱讀 974評論 0 2
  • 聲明:本文來源于http://www.webzsky.com/?p=731我只是在這里作為自己的學(xué)習(xí)筆記整理一下(...
    angryyan閱讀 7,032評論 1 6