通过 event.target，我怎么知道它是复选框还是收音机？答案

【问题标题】：By event.target, how I know that it is checkbox or it is radio?通过 event.target，我怎么知道它是复选框还是收音机？
【发布时间】：2013-11-28 10:58:52
【问题描述】：

在我的 html 中：

<input type="checkbox" name="select">

<input type="radio" name="select">

由于某些逻辑原因，名称属性相同

在我的 JS 中

我写下面的代码：

$('input[type="checkbox"],input[type="radio"]').on("change",function(event){
    console.log(event.target.nodename);
    // on both cases it show "INPUT"
    }

    });

我如何知道我点击了复选框或单选按钮？

【问题讨论】：

你可以（ES6+）使用返回布尔值的Element.matches()，而不是使用JQuery。

标签： javascript html jquery forms radio-button

【解决方案1】：

对于带有 jQuery 的节点类型，您可以使用：

$(event.target).attr('type')
event.target .type

$("SELECTOR").click(function (event) {
var idEventTarget = $(event.target).attr('id');
console.log($(event.target).attr('type'));
console.log(event.target.type);
});

【讨论】：

【解决方案2】：

对于那些寻找纯 JavaScript 方式的人，它是 event.target.tagName。

该属性是元素类型的大写字符串，如“A”、“UL”、“LI”等。

【讨论】：

这将始终是 INPUT，因为单选按钮和复选框都使用 INPUT 标签。您要检查类型属性，该属性将是“radio”或“checkbox”

【解决方案3】：

.nodeName 给出了使用的html 标记，因此您必须使用.type 来获取那里的节点类型。

试试这个：

console.log(event.target.type);

Demo

【讨论】：

@thechad “这不是香草 javascript 的答案”是什么意思？ type 是纯 JavaScript 中 HTMLInputElement 的属性（如果事件是从输入元素触发的，则 event.target 是）；你不需要 jQuery。
是的，你是对的......我的猜测是，这是另一个涉及 jquery 的帖子的答案，我脑子里放了个屁，点击了错误的东西，我的错。感谢您指出这一点，我删除了我的旧评论，所以我看起来不像个白痴：/

【解决方案4】：

你可以使用

function test(e)
{
   var eve = e || window.event;
   var ele = eve.target || eve.srcElement;

   switch(ele.getAttribute('type'))
   {
     case "radio" : //do whatever

     case "checkbox" : //do
   }

}

【讨论】：

【解决方案5】：

尽量用attr()点赞，

console.log($(this).attr('type'));// checkbox or radio

代码

$('input[type="checkbox"],input[type="radio"]').on("change", function (event) {
    console.log($(this).prop('tagName'));// INPUT
    console.log($(this).attr('type'));// checkbox or radio
});

【讨论】：

【解决方案6】：

console.log($(event.target).is(':radio'));
console.log($(event.target).is('[type="radio"]'));

【讨论】：

【解决方案7】：

您可以改用event.target.getAttribute('type')

【讨论】：