javascript中事件处理的方法有:1、在标签的事件属性中添加事件,语法“<标签名 事件属性名=”事件处理程序”>”;2、使用事件源的事件属性绑定事件处理函数,语法“事件源对象.on事件名 = 事件处理函数”。
本教程操作环境:windows7系统、javascript1.8.5版、Dell G3电脑。
javascript事件处理的方法
方法1、在标签的事件属性中添加事件
使用HTML标签的事件属性绑定处理程序。需要注意的是,使用 HTML 标签的事件属性绑定事件处理程序的方式时,事件属性中的脚本代码不能包含函数声明,但可以是函数调用或一系列使用分号分隔的脚本代码。
示例:
<!doctype html> <html> <head> <meta charset="utf-8"> <script> function printName(){ var name = "张三"; alert(name); } </script> </head> <body> <input type="button" onClick="printName()" value="事件绑定测试"/> </body> </html>
方法2、使用事件源的事件属性绑定处理程序
使 HTML 和 JS 分离的其中一种方式是通过使用事件源的事件属性绑定事件处理函数,绑定格式如下:
obj.on事件名 = 事件处理函数
格式中的 obj 为事件源对象。绑定的事件程序通常为一个匿名函数的定义语句,或者是一个函数名称。
事件源的事件属性绑定处理程序示例:
oBtn.onclick = function(){//oBtn为事件源对象,它的单击事件绑定了一个匿名函数定义 alert('hi') };
示例:使用事件源的事件属性绑定事件处理函数。
<!doctype html> <html> <head> <meta charset="utf-8"> <script> window.onload = function(){//窗口加载事件绑定了一个匿名函数 //定义一个名为fn的函数 function fn(){ alert('hello'); } //获取事件源对象 var oBtn1 = document.getElementById("btn1"); var oBtn2 = document.getElementById("btn2"); //绑定一个匿名函数 oBtn1.onclick = function(){ alert("hi"); } //绑定一个函数名 oBtn2.onclick = fn; }; </script> </head> <body> <input type="button" id="btn1" value="绑定一个匿名函数"> <input type="button" id="btn2" value="绑定一个函数名"> </body> </html>
【推荐学习:javascript高级教程】
以上就是javascript中事件处理的方法有哪些的详细内容,更多请关注其它相关文章!
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。