JavaScript(js)處理的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');
//內容發(fā)生改變,并焦點發(fā)生改變,才可以監(jiān)聽到
d.οnchange=function () {
alert('內容發(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
更多關于JavaScript相關內容可查看本站專題:《JavaScript事件相關操作與技巧大全》、《JavaScript常用函數(shù)技巧匯總》、《javascript面向對象入門教程》、《JavaScript錯誤與調試技巧總結》、《JavaScript數(shù)據(jù)結構與算法技巧總結》及《JavaScript數(shù)學運算用法總結》
希望本文所述對大家JavaScript程序設計有所幫助。
相關文章
TypeScript環(huán)境搭建的實現(xiàn)步驟
本文主要介紹了TypeScript環(huán)境搭建的實現(xiàn)步驟,文中通過示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2022-01-01
javascript 延遲加載技術(lazyload)簡單實現(xiàn)
layui+ssm實現(xiàn)數(shù)據(jù)表格雙擊編輯更新數(shù)據(jù)功能

