关于javaScript注册click事件传递参数的不成功问题_javascript技巧

最近这半年作为一个java 程序员,我写的javaScript代码都快比java代码多了,前段时间是给某银行做一个柜员管控系统,在柜员授权这一块功能上,由于柜员的授权需要考虑各方面的因素,比如机构权限、柜员类型权限、岗位权限,业务权限等等,并且要对这些权限要做多次的交集或者并集处理,页面上不得不用许多的javascript来进行控制。造成了这一功能模块的实现上javaScript代码比java代码负责的情况。

而现在又要给某银行开发一个保管箱管理系统,其核心功能块保管箱座管理以及保管箱管理,为实现管理功能上类似与C/S架构那样直观、方便,并将处理结果实时的显示给操作人员,经过几日思考与实验,最终使用CSS+javaScript+java来进行开发,用java来处理业务逻辑,用CSS用来表现目标对象的各种状态,用javaScript来根据目标对象的状态转变,来实现其CSS的切换。

在这其中遇到了一个难题,就是在javaScript中给一个html元素注册click事件处理函数时,比如给该处理函数传3个参数。可是不管是使用下面那种方式(node表示要注册事件的节点,fun为事件处理函数)都不能给事件处理函数传递参数:

node.addEventListener('click', fun, false);
node.attachevent('onclick', fun);
Node['onclick']=fun

显然以方式都不行,注意一下写法都是不正确的:

node.addEventListener('click', fun(arg1,arg2,arg3), false);
node.attachevent('onclick', fun(arg1,arg2,arg3));
Node['onclick']=fun(arg1,arg2,arg3)

好在读过一本书《JavaScript.DOM高级程序设计》,在这本书上找到了解决方案。首先编写一个方法:

function bindFunction(obj, func){
var args = [];
for(var i =2; i < arguments.length; i++) {
args.push(arguments[i]);
}
return function(){
func.apply(obj, args);
};
};

然后在自己的js库中添加如下两个方法,如有不明白的地方,可以参考《JavaScript.DOM高级程序设计》,其中该书2.3小节有该方法的说明,只是本人加了些许改动:

function bindFunction(obj, func){
var args = [];
for(var i =2; i < arguments.length; i++) {
args.push(arguments[i]);
}
return function(){
func.apply(obj, args);
};
};
window['OYF_MARK']['bindFunction'] = bindFunction;
function addEvent(node, type, listener){
//使用前面的方法检查兼容性以保证平稳退化
if (!isCompatible()) {
return false
}
if (!(node = $(node)))
return false;
if (node.addEventListener) {
//W3C的方法(冒泡事件,如果将false改为true,则为捕获事件)
node.addEventListener(type, listener, false);
return true;
}
else
if (node.attachEvent) {
//MSIE的方法
node['e' + type + listener] = listener;
node[type + listener] = function(){
node['e' + type + listener](window.event);
}
node.attachEvent('on' + type, node[type + listener]);
return true;
}
//若两种方法都不具备则返回false
return false;
};
window['OYF_MARK']['addEvent'] = addEvent;

以上两个函数为本人根据《JavaScript.DOM高级程序设计》中源代码稍作修改,添加到自己的的一个js库中,以便复用。接下来就可以使用如下方式给元素注册事件并向事件处理函数传递参数了:

//注册新的onclick事件处理函数
OYF_MARK.addEvent(e,'click',OYF_MARK.bindFunction(e,getContainerDetail,x,y,containid));

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索传递参数
注册事件
javascript click、javascript click事件、javascript a click、javascript 触发click、javascript ng click,以便于您获取更多的相关知识。

时间: 2024-09-11 23:50:45

关于javaScript注册click事件传递参数的不成功问题_javascript技巧的相关文章

javascript为按钮注册回车事件(设置默认按钮)的方法_javascript技巧

本文实例讲述了javascript为按钮注册回车事件(设置默认按钮)的方法.分享给大家供大家参考.具体如下: 首先不得不说,在JS方面,自己真的是个不折不扣的菜鸟.对于JS以及一些JS框架如JQuery等JS框架,自己也只是处在简单应用的阶段,当然自己也在不断的学习当中,希望将来能跟大家分享更多JS方面的心得.今天先来点开胃的,说一下如何设置一个默认按钮,就是不管焦点在不在按钮上,只要按下回车,就等于触发了按钮的单击事件. 代码非常简单,要完成这个功能,只需几行代码: //为keyListene

js和jquery批量绑定事件传参数一(新猪猪原创)_javascript技巧

复制代码 代码如下: <input type="button" value="btn1" id="btn1"/> <input type="button" value="btn2" id="btn2"/> <input type="button" value="btn3" id="btn3"/>

javascript的onchange事件与jQuery的change()方法比较_javascript技巧

改变一下思路变成键盘按键事件,如下: <asp:TextBox ID="txtName" runat="server" onkeyup="fNameChange();"></asp:TextBox> 这里有一点毛病是,你复制粘贴的内容,无法触发这个事件.下面是相关的一些代码: 复制代码 代码如下: function fNameChange(){ if($('#txtName').val().length<6){ jQ

IE8的JavaScript点击事件(onclick)不兼容的解决方法_javascript技巧

博客园闪存分页是用JavaScript生成的,今天发现在IE8下点击页码不能翻页,翻页操作是在当前页码的onclick事件中进行的. 开始代码是这么写的: 复制代码 代码如下: var a = document.createElement("a");a.setAttribute("onclick", this.ClickFunctionName + "(" + pageIndex + ");Pager.SetCurrent("

深入浅析JavaScript中对事件的三种监听方式_javascript技巧

事件(Event)是JavaScript应用跳动的心脏,也是把所有东西粘在一起的胶水,当我们与浏览器中Web页面进行某些类型的交互时,事件就发生了. 第一种监听方式,也是最普遍使用的方式,是直接在代码上加载事件,产生效果: <table> <tr onmouseover='this.style.backgroundColor="red"' onmouseout='this.style.backgroundColor=""'><td>

事件链接-C# 如何将子窗口的BUTTON按钮的CLICK事件传递给主窗口的BUTTON的CLICK事件?

问题描述 C# 如何将子窗口的BUTTON按钮的CLICK事件传递给主窗口的BUTTON的CLICK事件? 我想把在一个主窗口之下新建的一个窗口的打开按钮的事件和主窗口的打开按钮事件链接在一起,从而不管新建多少个子窗口,打开按钮都统一用主窗口的打开按钮,,,,,求完整代码,要C# WINFORM的... 解决方案 可以把主窗口中的处理操作单独写出来成一个函数,然后所有的点击函数都调用这个函数不就一样了么

jquery 中click事件传递绑定click事件的元素本身

问题描述 jquery 中click事件传递绑定click事件的元素本身 jquery 中click事件怎么传递绑定click事件的元素本身,也就是传递我点击的那个元素. 解决方案 function.call/apply来更改tihs指向 解决方案二: $('#xxxxl').on( 'click', function() { var self = $(this); self.parent().next().slideToggle("fast"); self.hasClass('fol

click事件的参数可以变化吗?

问题描述 现有这样的jquery click事件:$(document).ready(function() { $curtainopen = false; $(".rightcurtain").click(function(){ $(this).blur(); if ($curtainopen == false){ $(this).stop().animate({top: '0px' }, {queue:false, duration:350, easing:'easeOutBounc

windows form button 单机事件传递参数

问题描述 如图用这个方法参数不能是有参数的方法么... 解决方案 解决方案二:不是提示了错误的吗,这里只能输入方法名称,不能输入参数解决方案三:你这是调用事件啊?自己去写个方法试试解决方案四:看你这里,是想调用这个按钮的text属性?你直接用Buttonbtn1=senderasButton;获取这个触发事件的按钮,然后再使用他的text属性不就可以了?解决方案五:如果想调用事件,是newEventHandler(buton1_click)解决方案六:这个事件一般是不需要额外传参的,因为Even