JavaScript(js)處理的HTML事件、鍵盤事件、鼠標事件簡單示例
更新時間：2019年11月19日 09:17:56 作者：xuehyunyu
這篇文章主要介紹了JavaScript(js)處理的HTML事件、鍵盤事件、鼠標事件,結(jié)合實例形式分析了JavaScript針對HTML事件、鍵盤事件及鼠標事件的簡單處理方法,需要的朋友可以參考下
本文實例講述了JavaScript(js)處理的HTML事件、鍵盤事件、鼠標事件。分享給大家供大家參考，具體如下：
示例代碼：
HTML文件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HTML文件</title>
<script>
window.οnlοad=function () {
var d=document.getElementById('d');
//內(nèi)容發(fā)生改變，并焦點發(fā)生改變，才可以監(jiān)聽到
d.οnchange=function () {
alert('內(nèi)容發(fā)生改變')
}
}
</script>
</head>
<body>
<input type="text" id="d" value="">
</body>
</html>
鍵盤事件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>鍵盤事件</title>
<script>
window.οnlοad=function () {
window.οnkeypress=function (e) {
// alert(e.key)//彈出按鍵對應的字母
// alert(e.keyCode)
if (e.charCode==103){
alert('G鍵被點擊')
}
}
}
</script>
</head>
<body>
</body>
</html>
鼠標事件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>鼠標事件</title>
<script>
window.οnlοad=function () {
var input=document.getElementById('b');
input.οnclick=function () {
alert('按鈕被點擊了');
}
var c= document.getElementById('c');
c.οndblclick=function () {
alert('雙擊')
}
}
</script>
</head>
<body>
<input type="button" id="b" value="點擊">
<input type="button" id="c" value="雙擊">
</body>
</html>
PS：這里再為大家附上javascript系統(tǒng)自帶事件參考表供大家參考查詢：
javascript事件與功能說明大全：
http://tools.jb51.net/table/javascript_event
更多關(guān)于JavaScript相關(guān)內(nèi)容可查看本站專題：《JavaScript事件相關(guān)操作與技巧大全》、《JavaScript常用函數(shù)技巧匯總》、《javascript面向?qū)ο笕腴T教程》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》及《JavaScript數(shù)學運算用法總結(jié)》
希望本文所述對大家JavaScript程序設計有所幫助。
相關(guān)文章
本文介紹的方法基于javascript，css和myFunction結(jié)合可實現(xiàn)頁面展示轉(zhuǎn)換，下面有個示例，大家可以參考下2014-07-07
ES5 ES6中Array對象去除重復項的方法總結(jié)
這篇文章主要給大家介紹了Array對象去除重復項的相關(guān)資料，文中通過示例代碼詳細介紹了在ES5和ES6中Array對象去除重復項的方法，需要的朋友可以參考借鑒，下面來一起看看吧。2017-04-04
JavaScript中的FileReader圖片預覽上傳功能實現(xiàn)代碼
本文通過實例代碼給大家介紹了js中的FileReader圖片預覽上傳功能，代碼分為html和js代碼兩部分，具體實現(xiàn)代碼大家參考下本文2017-07-07
在默認的餅狀圖里面,圖例legend顏色是黑色的,有時候根據(jù)ui需要,根據(jù)不同的背景色,下面這篇文章主要給大家介紹了關(guān)于echarts自定義legend樣式的相關(guān)資料,需要的朋友可以參考下2022-10-10
（推薦一個超好的JS函數(shù)庫）S.Sams Lifexperience ScriptClassLib
（推薦一個超好的JS函數(shù)庫）S.Sams Lifexperience ScriptClassLib...2007-04-04
下面小編就為大家?guī)硪黄猨s數(shù)字舍入誤差以及解決方法(必看篇)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-02-02
這篇文章主要介紹的是一個js確認刪除對話框適用于a標簽及submit，非常好用，需要的朋友不要錯過2014-07-07
這篇文章主要介紹了JS實現(xiàn)的數(shù)字格式化功能,結(jié)合實例形式分析了javascript針對數(shù)字與字符的相關(guān)運算處理技巧,需要的朋友可以參考下2017-02-02
JavaScript三大重點同步異步與作用域和閉包及原型和原型鏈詳解
這篇文章主要介紹了JavaScript同步異步與作用域和閉包及原型和原型鏈，每個對象都連接到一個原型對象，并且它可以從中繼承屬性。所有通過對象字面量創(chuàng)建的對象都連接到object.prototype，它是JavaScript中的標配對象<BR>2022-07-07
這篇文章主要介紹了JS實現(xiàn)漂亮的時間選擇框效果,結(jié)合實例形式分析了javascript時間選擇框插件的實現(xiàn)與使用方法,需要的朋友可以參考下2016-08-08