当前位置:首页 > Web开发 > 正文

通常放在页面底部的js代码中比较多function onchangeTest(){alert("我是值改变事件");}

2024-03-31 Web开发

js中添加事件的第一种方法:

在HTML上直接使用事件属性来添加,属性值为监听执行的函数

js中的事件只有在当前HTML上有效

一个HTML可以添加多个差此外事件

一个监听事件可以触发多个函数,差此外函数之间用分号离隔

点击事件

单机 onclick

双击 ondblclick

鼠标事件

onmou搜索引擎优化ver 当鼠标悬停在某个HTML标签上的时候触发

onmousemove 当鼠标在某个HTML上移动时触发

onmou搜索引擎优化ut 当鼠标溢出某个HTML时触发

键盘事件

onkeyup 当键盘在某个HTML元素上弹起时触发

onkeydown 当键盘在某个HTML元素上下压时触发

焦点事件

输入框一闪一闪阿谁竖线就是焦点

onfoucus 当某个HTML元素获取焦点时触发,连续触发

onblur 当某个HTML元素掉去焦点时触发

值转变事件

 onchange 当值被转变时触发

页面加载事件

onload 当页面加载告成时触发。用在body标签里

代码

<!DOCTYPE html> <html> <head > <meta charset="utf-8"> <title ></title> </head> <body> <!-- 点击事件 单机 onclick 双击 ondblclick 鼠标事件 onmou搜索引擎优化ver 当鼠标悬停在某个HTML标签上的时候触发 onmousemove 当鼠标在某个HTML上移动时触发 onmou搜索引擎优化ut 当鼠标溢出某个HTML时触发 键盘事件 onkeyup 当键盘在某个HTML元素上弹起时触发 onkeydown 当键盘在某个HTML元素上下压时触发 焦点事件 输入框一闪一闪阿谁竖线就是焦点 onfoucus 当某个HTML元素获取焦点时触发 onblur 当某个HTML元素掉去焦点时触发 页面加载事件 onload 当页面加载告成时触发 注意: js中添加事件的第一种方法: 在HTML上直接使用事件属性来添加,,属性值为监听执行的函数 js中的事件只有在当前HTML上有效 一个HTML可以添加多个差此外事件 一个监听事件可以触发多个函数,差此外函数之间用分号离隔 --> <script type="text/javascript"> function onclickTest(){ alert("我是单击事件"); } function ondblclickTest(){ alert("我是双击事件"); } function onmou搜索引擎优化verTest(){ alert("我是鼠标悬停事件"); } function onmousemoveTest(){ alert("我是鼠标移动事件"); } function onmou搜索引擎优化utTest(){ alert("我是鼠标移掉事件"); } function onkeyupTest(){ alert("我是按键抬起事件"); } function onkeydownTest(){ alert("我是按键按下事件"); } function onfocusTest(){ alert("我是获得焦点事件"); } function onblurTest(){ alert("我是掉去焦点事件"); } function onloadTest(){ alert("我是加载页面事件"); } //onloadTest()页面加载事件也可以跟着js代码的位置加载,凡是放在页面底部的js代码中对照多 function onchangeTest(){ alert("我是值转变事件"); } </script> <h1>js事件</h1> <hr> <!-- 点击事件 单机 onclick 双击 ondblclick --> <h3>点击事件</h3> <button type="button">单击事件</button> <button type="button" ondblclick="ondblclickTest()">双击事件</button> 鼠标事件<!-- onmou搜索引擎优化ver 当鼠标悬停在某个HTML标签上的时候触发 onmousemove 当鼠标在某个HTML上移动时触发 onmou搜索引擎优化ut 当鼠标溢出某个HTML时触发 --> <h3>鼠标事件</h3> <div onmousemove="onmousemoveTest()"></div> <!-- 键盘事件 onkeyup 当键盘在某个HTML元素上弹起时触发 onkeydown 当键盘在某个HTML元素上下压时触发 --> <h3>键盘事件</h3> 按键按下:<input onkeydown="onkeydownTest()"/> 按键抬起:<input onkeyup="onkeyupTest()"/> <!-- 焦点事件 输入框一闪一闪阿谁竖线就是焦点 onfoucus 当某个HTML元素获取焦点时 连续触发 onblur 当某个HTML元素掉去焦点时触发 --> <h3>焦点事件</h3> 获得焦点:<input onfocusin="onfocusTest()" /> 掉去焦点:<input onblur="onblurTest()" /><br/> <!-- 值转变事件 onchange:当标签的value值转变时触发 --> 值转变事件:<select onchange="onchangeTest()"> <option value ="null">--请选择--</option> <option value ="白云一中">白云一中</option> <option value ="白云二中">白云二中</option> <option value ="白云三中">白云三中</option> </select> <!-- 页面加载事件 onload 当页面加载告成时触发 --> <h3>页面加载事件</h3> 见body标签 </body > </html>

温馨提示: 本文由Jm博客推荐,转载请保留链接: https://www.jmwww.net/file/web/31422.html