Eventlistener in javascript to jQuery
Eventlistener in javascript to jQuery
我有一个代码,它为我的每个名为"CheckAll"的按钮添加了一个check-all切换我最近遇到了一个问题,在IE浏览器中,按钮不工作,我发现addEventListener在IE中不工作,你必须使用attachEvent,但有些人说这也会产生后果,他们建议使用jQuery。那么,有人可以演示我的javaScript的jQuery版本吗?这是代码
function script1(){
var el = document.getElementsByName('CheckAll');
el1 = el[0];
el2 = el[1];
el3 = el[2];
el4 = el[3];
el5 = el[4];
el6 = el[5];
el7 = el[6];
el1.addEventListener('click', function(){selectAll(0,8)}, false);
el2.addEventListener('click', function(){selectAll(8,16)}, false);
el3.addEventListener('click', function(){selectAll(16,26)}, false);
el4.addEventListener('click', function(){selectAll(26,34)}, false);
el5.addEventListener('click', function(){selectAll(34,44)}, false);
el6.addEventListener('click', function(){selectAll(44,52)}, false);
el7.addEventListener('click', function(){selectAll(52,60)}, false);
}
这是一个jfiddle小提琴
在jQuery中,有一个简单的函数可以绑定事件:.on
。您可以使用$
函数使用CSS表示法来选择元素:http://jsfiddle.net/VHXDx/11/.这将是所有需要的,没有selectAll
功能:
// run when elements are available
$(function() {
// select the `CheckAll` buttons and run a function for each one
$("input[name='CheckAll']").each(function(i) { // `i` is a counter
// bind event
$(this).on("click", function() {
// select `AG[]` elements in the current row and toggle their checked property
$(this).closest("tr").find("[name='AG[]']").prop("checked", function(j, current) {
return !current;
});
});
});
});
function script1(){
var el = $('[name="CheckAll"]');
el.on('click', function() {
$(this).closest('td').siblings().find('input[name="AG[]"]').each(function(i,e) {
e.checked = !e.checked;
});
});
}
FIDDLE
为什么不使用attachEvent
?您可以在不使用jQuery的情况下轻松构建一个简单的跨浏览器addEvent
函数。
var add = document.addEventListener ? function(el, type, fn) {
el.addEventListener(type, fn, false);
} : function(el, type, fn) {
el.attachEvent("on"+type, fn.bind(el), false);
};
function script1(){
var els = document.getElementsByName('CheckAll');
var a = 1, b = 0;
for (var i=0; i<els.length; i++) {
a *= -1;
add(els[i], 'click', selectAll.bind(null, b, b+= 9+a));
}
}
相关文章:
- grep in JQuery to C#
- jQuery to pass Checkbox Update mysql
- jQuery to Javascript Conversion for AJAX request
- jQuery to shift object
- ajax post with jquery to mongodb
- JQuery to regular JavaScript
- JQuery to css write nth-child()
- jquery to javascript translation
- Javascript/JQuery to do rollover-effect confirm
- MVC4 jquery to deselect Html.CheckboxListFor
- jQuery to regular Javascript - overlay
- jQuery to plain javascript
- JQuery to Fixed()未正确显示
- Click Listener from jQuery to Javascript
- Adding JavaScript JQuery to HTA
- 可以't find why this js/jQuery to list last 12 months gene
- Turn '$(this)' jquery to javascript 'this'
- Jquery to Mootools
- Javascript/Jquery to change class onclick?
- javascript/jquery to change location.href