检查DOM元素是否为复选框。

32

如何检查给定的DOM元素是否为复选框。

场景:

我有一组文本框和复选框,其中的值是动态分配的。我没有办法确定DOM元素是复选框还是文本框。

10个回答

81

只使用纯JavaScript,您可以执行以下操作:

if (el.type && el.type === 'checkbox') {
   ...
}

甚至更短

if ((el || {}).type === 'checkbox') {
   ...
}

或者在现代浏览器中,您可以使用matches()

if (el.matches('[type="checkbox"]') {
    ...
}

4
多年以后…… 你可能想要将那个类型值转换为小写,对吧? - Nathan
不,请将其转换为 lowerCase 然后进行比较。 - Andreas Köberle
@AndreasKöberle 这应该取决于您在标记中如何编写属性,对吧? - Fabrizio Calderan
你甚至可以使用'input[type="checkbox"]'来确保安全。 - Marvin

18
如果您正在使用jQuery,您可以使用:checkbox伪类选择器和is方法:
if($("#that-particular-input").is(":checkbox")) {
}

如果我没记错的话,:checkbox 是一个伪类。 - Marvin

15

检查任何事情

function isCheckbox (element) {
   return element instanceof HTMLInputElement 
      && element.getAttribute('type') == 'checkbox'
}

5
if( $(element)[0].type == "checkbox" ) {

}

或者

if( $(element).is(':checkbox') ) {

}

2

看一下复选框选择器

var checkboxes = $("form input:checkbox");

您可以通过以下方式确定输入的类型:

if ($(".your-input").is(":text"))
{
    // Textbox
}
else if ($(".your-input").is(":checkbox"))
{
    // Checkbox
}

2
if (<DOMNode>.type === "checkbox") {
    // ...
}

1

试试这个;

  $(element).is(':checkbox');

这里的 element 是您的选择器 element

if(  $(element).is(':checkbox') ) {
  // do something
}

1

jQuery is()

if ($el.is(':checkbox')) { ... }

1
您可以使用伪选择器 :checkbox 并调用 jQuery 的 is 函数:

$('#myinput').is(':checkbox')


0
你应该有一个合理的命名规范,这样你就可以通过查看元素的id或名称来知道它是否是复选框。 例如:"chkMyCheckbox"

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接