JavaScript 事件屬性綁定帶參數的函數

來源:互聯網
上載者:User

例如不能採用這種調用方式:element.onclick = test();element.onclick = test(arg1,arg2);只能通過element.onclick = function(){ ... };或者element.onclick = test這種方式來實現,所以無法給函數傳遞參數。參考了大量的網上資料,解決這個問題的方式,以代碼為例,如下所示: 複製代碼 代碼如下:function Handler() { };
Handler.prototype = {
/*
* 把eventType類型的事件綁定到element元素,並使用handler事件控制代碼進行處理
* 相容 IE 及 Firefox 等瀏覽器
*
* @param element 在其上註冊事件的對象(Object)
* @param eventType 註冊的事件類型(String),不加“on”
* @param handler 事件控制代碼(Function)
*/
registerEvent : function(element, eventType, handler) {
if(element.attachEvent) { //2級DOM的事件處理
element.attachEvent('on'+ eventType, handler);
}else if (element.addEventListener) {
element.addEventListener(eventType, handler, false);
} else { //0級DOM的事件處理
element['on'+ eventType] = handler;
}
},
/*
* 獲得帶參數的事件控制代碼的引用
*
* @param obj 需要綁定事件處理函數的所有者,null 表示 window 對象
* @param func 需要綁定的事件處理函數名
* @param ... 第三個參數開始為綁定事件處理函數的參數,由 0 到多個構成
*/
bind: function(obj, handler) {
obj = obj || window;
var args = [];
for(var i =2; i < arguments.length; i++)
{
args.push(arguments[i]);
}
return function() { handler.apply(obj, args) };
}
}
可能是使用方式為:
function show(txtObj) {
alert(txtObj.value);
txtObj.focus();
txtObj.select();
}
window.onload = function(){
var handler = new Handler();
handler.registerEvent($("txt"), "change", handler.bind(null,show,$("txt")));//採用2級事件模型的方式
//$("txt").onchange = handler.bind(null,show,$("txt"));//JavaScript事件屬性的方式
}
相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.