Javascript attachEvent传递参数的办法

yizhihongxing

当使用Javascript的attachEvent来绑定事件时,我们希望能够给事件处理函数传递一些参数,但是attachEvent本身并不支持传递参数。下面介绍两种解决方法。

方法一:使用闭包

使用闭包是attachEvent传递参数的一种常用方法。首先,我们先定义一个函数来包装我们要执行的事件处理函数。在这个包装函数中,我们可以访问到需要传递的参数,并把这些参数保存在闭包中。然后,我们将包装好的函数绑定到element的事件上。

function bindEvent(element, event, func, arg) {
    var wrapper = function() {
        func(arg);
    };
    element.attachEvent('on'+event, wrapper);
}

上面的代码中,bindEvent函数会接收四个参数,分别为DOM元素、事件类型、事件处理函数、需要传递的参数。在代码中,我们定义了一个wrapper函数,该函数实际上是事件处理函数的包装函数,它可以访问到arg参数。在wrapper函数中,我们调用了事件处理函数func,并把arg作为参数传递给了func。

下面是一个使用闭包传递参数的示例:

<button id="myButton">点击我</button>
var myButton = document.getElementById('myButton');
bindEvent(myButton, 'click', function(num){
    alert('点击了按钮,num='+num);
}, 123);

上面的示例中,我们给myButton绑定了一个click事件处理函数,同时传递了一个参数123。在事件处理函数中,我们可以使用该参数。

方法二:使用匿名函数

另一种常用的attachEvent传递参数的方法是使用匿名函数。我们可以写一个匿名函数,在匿名函数内部调用我们实际想要执行的事件处理函数并传递参数。然后,把这个匿名函数直接绑定到element的事件上。

function bindEvent(element, event, func, arg) {
    element.attachEvent('on'+event, function() {
        func(arg);
    });
}

使用匿名函数传递参数的示例:

<button id="myButton">点击我</button>
var myButton = document.getElementById('myButton');
bindEvent(myButton, 'click', function(num){
    alert('点击了按钮,num='+num);
}, 123);

上面的示例中,我们给myButton绑定了一个click事件处理函数,同时传递了一个参数123。在事件处理函数中,我们可以使用该参数。

总之,attachEvent传递参数需要使用一些技巧,我们可以使用闭包或匿名函数来解决这个问题。以上两种方法在实际开发中都非常常用,具有良好的实用价值。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:Javascript attachEvent传递参数的办法 - Python技术站

(0)
上一篇 2023年6月10日
下一篇 2023年6月10日

相关文章

  • 在JavaScript中使用开平方根的sqrt()方法

    当在JavaScript代码中需要进行数字计算时,常常需要使用特定的数学函数。其中一个很常用的函数就是开平方根函数。在JavaScript中,可以使用内置的 Math.sqrt() 方法来计算一个数字的开平方根。 使用方法 Math.sqrt() 方法需要传递一个数字作为参数,然后返回这个数字的开平方根值。示例代码如下: let num = 25; let …

    JavaScript 2023年5月27日
    00
  • js时间戳转yyyy-MM-dd HH-mm-ss工具类详解

    下面我就来详细讲解“js时间戳转yyyy-MM-dd HH-mm-ss工具类详解”的完整攻略。 1. 背景介绍 在Web前端开发中,经常需要对时间数据进行处理,而时间戳和日期格式之间的转换是比较常见的一种操作。本文将介绍如何编写一个JS时间戳转日期格式的工具类,并提供相关的示例代码。 2. 时间戳转日期 2.1 思路分析 要将一个时间戳转换为日期格式,需要用…

    JavaScript 2023年5月27日
    00
  • js将当前时间格式转换成时间搓(自写)

    下面是关于如何将当前时间格式转换成时间戳的攻略。 什么是时间戳? 在计算机系统中,时间戳(timestamp),指的是一种类似于日期的格式,是一组单调递增的数字,通常表示从某个特定的时间点开始经过的秒数或毫秒数。 JS中将当前时间格式转换成时间戳的方法 JS中可以采用Date对象及其内置的方法来获取当前时间的格式,并将其转换为时间戳。 获取当前时间的格式 可…

    JavaScript 2023年5月27日
    00
  • 超越Jquery_01_isPlainObject分析与重构

    超越Jquery_01_isPlainObject分析与重构 1. isPlainObject函数分析 isPlainObject函数用于判断传入的对象是否为纯粹的JavaScript对象。具体实现如下: function isPlainObject(obj) { var proto, Ctor; // 剔除null和非对象类型 if (!obj || {}…

    JavaScript 2023年6月11日
    00
  • 深入理解JavaScript事件机制

    深入理解JavaScript事件机制 JavaScript的事件机制为我们在网页中开发交互体验提供了强大的支持。要深入理解JavaScript事件机制包括以下三个方面: 事件类型 事件模型 事件处理函数 事件类型 JavaScript中定义了很多事件类型,例如鼠标相关的事件类型包括: click 鼠标单击事件 dblclick 鼠标双击事件 mousedow…

    JavaScript 2023年6月11日
    00
  • 写一个含数字,拼音,汉字的验证码生成类

    针对“写一个含数字、拼音、汉字的验证码生成类”的任务,我会提供以下详细的攻略: 步骤一:确定需求 在开始编写代码之前,我们需要先明确生成验证码类的需求,这意味着我们需要回答以下问题: 验证码的长度是多少? 验证码包含哪些类型的字符(数字、拼音、汉字或其他字符)? 验证码生成后,是否需要对外提供获取生成的字符串的方法? 步骤二:编写代码 接下来,我们可以开始编…

    JavaScript 2023年5月19日
    00
  • JS实现HTML标签转义及反转义

    HTML中的特殊字符,如尖括号、引号、和符号等,需要进行转义才可以在HTML文本中正常显示。而JS提供了很方便的方法来实现HTML标签的转义及反转义。下面是一份JS实现HTML标签转义及反转义的完整攻略。 转义HTML标签 HTML中的特殊字符,如尖括号、引号、和符号等,需要进行转义才可以在HTML文本中正常显示。JS提供了 htmlentities 函数来…

    JavaScript 2023年5月19日
    00
  • 利用JavaScript获取用户IP属地方法详解

    标题:利用JavaScript获取用户IP属地方法详解 正文:JavaScript作为Web前端开发中的重要语言,常常需要获取用户的IP地址及其所属位置信息。以下是获取用户IP属地的方法详解: 一、使用第三方API接口 使用第三方API接口是获取用户IP属地信息的一种常见方法。可以调用一些免费的IP地址查询API接口,返回结果中包含用户IP的国家、省份、城市…

    JavaScript 2023年6月11日
    00
合作推广
合作推广
分享本页
返回顶部