如何将事件绑定到元素？

Question

如何在纯javascript中将事件绑定到元素：

这是JQuery所做的，您如何用纯javascript完成它？

$('#arrow_left') 
.bind('click', {'c_index': c_index - item_limit }, 
    function(e) 
    { 
    var r = e.data.c_index; 
    } 

Answer 1

你会使用element.AddEventListener

target.addEventListener(type, listener[, useCapture]); 

而且在IE的情况下（之前IE9），需要使用attachEvent。

bSuccess = object.attachEvent(the_event, function_handler) 
//the_event always starts with "on" 

像这样：

<input id="btn" type="button" value="click me" />​​​​​​​​​​​ 

JS：

function click_handler() 
{ 
    alert("clicked"); 
} 
var el = document.getElementById("btn"); 
if(el.addEventListener)//check if this exists 
{ 
    el.addEventListener("click", click_handler); 
} else { 
    //then we're on IE older than 9 
    el.attachEvent("onclick",click_handler); 
}​ 

观看演示： http://jsfiddle.net/E8nYr/2/

Answer 2

elem.addEventListener(eventType,  
         handler,  
         useCapture); 

为IE6,7,8：

elem.attachEvent (event,    
        handler);   

这是老式的方式，但你使用jQuery反正为什么改变？

Answer 3

对于非IE 您给它三个参数：事件类型，要执行的函数以及布尔值（true或false），指示事件处理程序是在捕获阶段还是在冒泡阶段执行。如果您不确定是要捕获还是冒泡，请使用false。

 

element.addEventListener('click',doSomething,false) 

//In IE 
element.attachEvent('onclick',doSomething)