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