我曾经使用以下内容来了解点击的项目是否为复选框:
if ($(e.target).className === 'checkbox') {}
升级到最新版本的jQuery后,现在返回Chrome,Safari和Firefox的未定义版本。
确定复选框上是否发生了点击的最佳方式是什么?
由于
答案 0 :(得分:3)
尝试使用.is
功能和:checkbox
选择器
if ($(e.target).is(':checkbox')) {
//it is a checkbox
}
DEMO: http://jsfiddle.net/a5SbG/1/
或者您可以尝试
if (e.target.type == 'checkbox') {
//It is a checkbox
}
答案 1 :(得分:3)
我认为你在混淆。
className
是元素的属性,而不是jQuery对象。所以,如果你真的想在没有jQuery的情况下获得这个类,你可以使用:
e.target.className == "checkbox"
但问题是className
可能是由空格分隔的多个类,所以你想要使用正则表达式或类似的东西来实际找到它。
如果你想在jQuery中这样做,我会使用:
$(e.target).hasClass("checkbox")
如果您真的在寻找复选框元素,可以使用以下任何一种方法:
e.target.tagName.toLowerCase() == "input" && e.target.type.toLowerCase() == "checkbox"
$(e.target).is("input:checkbox") // jQuery docs for :checkbox selector suggest including "input"
$(e.target).is('[type="checkbox"]') // jQuery docs also suggest to use this instead of the above because it's faster than :checkbox in modern browsers
答案 2 :(得分:1)
直接使用JS,我通常会这样做:
var eTarget = e.target !== null ? e.target : e.srcElement;
if (eTarget.type === 'checkbox') { }
答案 3 :(得分:0)
$(document).ready(function () {
$("input:checkbox").click(function () {
if ($(this).is(":checked")) {
//Do Stuff if Checked
}
});
});
答案 4 :(得分:0)
这似乎对我有用:
window.addEventListener('load', function () {
function onClick() {
if (this.tagName.toUpperCase() === 'INPUT' && this.type.toUpperCase() === 'CHECKBOX') {
console.log([this.tagName, this.type])
} else {
console.log("HTML Element has Wrong tag or type");
}
};
document.getElementById("myCheckBox").addEventListener('click', onClick);
document.getElementById("myButton").addEventListener('click', onClick);
});
HTML:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<label><input id="myCheckBox" type="checkbox" />Click Me!</label>
<input type="button" id="myButton" value="Click Me!" />
<script type="text/javascript" src="detectElementType.js"></script>
</body>
</html>
在此处查看此操作(在Chrome中点击F12以查看控制台,或打开FireBug控制台等):
http://www.sanbarcomputing.com/flat/forumPosts/detectElementType/detectElementType.html
所有浏览器都不支持addEventListener()(ECMAScript 5中的新增功能),但它具有优势。请在此处查看有关事件处理程序的文章:
http://www.javascripter.net/faq/addeventlistenerattachevent.htm