首页前端开发JavaScriptjavascript中事件处理的方法有哪些

javascript中事件处理的方法有哪些

时间2024-01-30 10:59:02发布访客分类JavaScript浏览923
导读:收集整理的这篇文章主要介绍了javascript中事件处理的方法有哪些,觉得挺不错的,现在分享给大家,也给大家做个参考。javascript中事件处理的方法有:1、在标签的事件属性中添加事件,语法“<标签名 事件属性名="事件处理程序...
收集整理的这篇文章主要介绍了javascript中事件处理的方法有哪些,觉得挺不错的,现在分享给大家,也给大家做个参考。

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中事件处理的方法有哪些的详细内容,更多请关注其它相关文章!

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

javascript事件处理"

若转载请注明出处: javascript中事件处理的方法有哪些
本文地址: https://pptw.com/jishu/592431.html
JavaScript怎么修改div文本 SignalR Self Host多端消息推送服务实例(三)

游客 回复需填写必要信息