在纯Javascript中获取复选框的ID或值答案

【问题标题】：Get ID or value of a checkbox onclick of that checkbox in pure Javascript在纯Javascript中获取复选框的ID或值
【发布时间】：2015-12-24 21:05:18
【问题描述】：

我正在为我的公司编写一个脚本，点击复选框后：

触发函数OptionSelected()
获取该复选框的ID
根据ID 执行按位运算

或者，最好是：

触发函数OptionSelected()
获取分配给该复选框的整数（<input="checkbox" value="2"，获取2）
使用 value 执行按位运算。

为了调试，我让我的代码返回给我一个警报，里面有值。我还没有写按位运算部分。

这是我的js代码：

function OptionsSelected(e)
{
    alert(e.target.id);
}

以及它引用的示例复选框：

<input type="checkbox" name="checkgrp" onclick="return OptionsSelected(e)" value="2" id="eXAMPLE"><LABEL id="LeXAMPLE"></LABEL>

当我在运行时单击该框时，我收到以下 javascript 错误消息：

有人解决这个问题吗？我想这很简单，所以除了提供你的修复之外，你能解释一下为什么你的修复有效吗？

如果您的解决方案通过直接拉取按位 value 代替实际的 ID 来节省我的时间，则可以加分。

注意：我不能使用GetElementByID 方法，因为我将获取ID 或value，而不是使用它来执行操作。

谢谢大家！

【问题讨论】：

将 e 替换为 this。所以它将是：onclick="return OptionsSelected(this)" 和 alert(e.target.id) 和 alert(e.id)。这应该工作

标签： javascript html checkbox getelementbyid

【解决方案1】：

当您使用onclick 属性调用脚本时，您是在自己调用函数。因此，在这种情况下，您将传递一个名为 e 的变量，而您从未定义过该变量。

相反，您可以传递对您单击的复选框的引用：

<input type="checkbox" name="checkgrp" onclick="return OptionsSelected(this)" value="2" id="eXAMPLE"><LABEL id="LeXAMPLE"></LABEL>

在OptionsSelected 你会这样做：

function OptionsSelected(me)
{
    alert(me.id);
}

【讨论】：

完美！有一个很好的解释。谢谢，这解决了我的问题。顺便说一句，通过将alert(me.id) 更改为alert(me.value)，我可以直接传递我需要的按位值。两全其美！
另外，如果你还没有这样做，你应该在你的标签上添加一个for 属性，所以它是可点击的（例如，<label for="eXAMPLE">...</label>

【解决方案2】：

当您调用函数OptionsSelected 时，未定义变量e。要解决这个问题，您可以使用 Tom 的解决方案。

或

查看您附加的错误消息，我猜您在 IE 上测试了您的代码。仅供参考，IE 不支持“target”属性，它们使用srcElement。所以你可以做这样的事情：

在html中，

<input type="checkbox" name="checkgrp" onclick="return OptionsSelected(window.event)" value="2" id="eXAMPLE"><LABEL id="LeXAMPLE"></LABEL>

在 JavaScript 中，

function OptionsSelected(e)
{
   alert((e.target || e.srcElement).value);
}

这样它就可以在所有浏览器上运行。

【讨论】：