如何让 js 函数识别已单击或空的复选框？答案

【问题标题】：How can I make a js function recognize a clicked or empty checkbox?如何让 js 函数识别已单击或空的复选框？
【发布时间】：2017-03-28 22:51:20
【问题描述】：

我正在修改现有表单。

您可以启动一个包含多个字段的任务块，如果这些都是空的，您可以再次删除该块。其中大多数是必需的，以在数据完整时提交。如果未完成，您可以保存 Work in Process（原文如此！我更喜欢 Work in Progress...）

对于识别空字段的代码，似乎大部分都有value=""。完成后，系统似乎识别出它们不是空的。

但我想使用的复选框会导致问题。

如果我不设置value=""，它不会被识别为空，我无法删除块。

如果我设置 value="" ，它无法识别输入的复选标记，我无法提交数据完成。

我认为onClick="...." 并定义一种设置value="true" 的方法将是一种前进的方式，但在搜索时没有找到任何示例，而且作为初学者，我还没有全部学会。

复选框（重新编号至 id 050）：

<label for="completed_001">Task Completed<em class="labelrequired">*</em></label>
<input type="checkbox" id="completed_001" name="completed_001" alt="Task Completed 001" title="Task Completed 001" value="" class="validate['required']">

函数：（最后一行与复选框有关）

function isEmptyAction(nr) {

    var pad = "000";
    var nr = (pad+nr).slice(-pad.length);

    return  document.getElementById('taskdescription' + nr).value == '' &&
            document.getElementById('TaskOwner' + nr).value == '' &&
            document.getElementById('taskduedate' + nr + '_date').value == '' &&
            document.getElementById('documentid' + nr).value == '' &&
            document.getElementById('resultsandcomments' + nr).value == '' &&
            document.getElementById('completed_' + nr).value == '';  
}

= = = = = 更新 = = = =

1) 感谢用户dmorrow 的编辑改进！

2) 感谢您的提示和建议，我终于成功了！

我从 html 的复选框代码中删除了 value=""。这允许在需要提交数据完成时识别输入的复选标记。

我在函数中使用document.getElementById('completed_' + nr).checked == false; 来检查所有字段是否为空。这允许在空时删除任务块。

再次感谢！你让我成为了一个快乐的初学者！

【问题讨论】：

我想你想要checked==true
它必须为空才能删除已启动但未使用的块。
你能用工作的 sn-p 更新代码吗？在编辑器中使用<> 图标
还不知道怎么做，刚加入论坛...我勉强得到了复选框代码sn-p。关于这些块有几个函数，initActions()，addAction( )、removeAction() 和 isEmptyAction(nr)。 removeAction 调用 isEmptyAction 以确保移除 Action（任务块）是合法的。
我只更改了 isEmptyAction，以检查正确的属性。在任务块中，我将完成检查从“完成日期”更改为仅一个复选框。如果无法将复选框值从“”识别为“真”，也许我必须将其保留为日期。

标签： javascript checkbox onclick

【解决方案1】：

在这条线上

 document.getElementById('completed_' + nr).value == '';

如果您没有值或空值，它将始终返回 true。因为您只是检查它的 value 属性，而不是检查状态。相反，您需要使用

  document.getElementById('completed_' + nr).checked;

然后它会根据复选框的状态返回真/假。

【讨论】：

谢谢，这对我来说似乎很有意义！那么，这是否可行，以确保在复选框为空时功能“通过”？还是该功能必须说其他话来确保这一点？我还需要在 html 部分的复选框中使用 value="" 吗？
不，如果你只需要检查复选框的状态，就是这样。但是如果你在其他地方更新复选框并且需要检查它是否有一个值，然后你可以像(document.getElementById('completed_' + nr).checked && document.getElementById('completed_' + nr).value !== '')一样使用它
从复选框代码中，我删除了 value="" 在函数中，我从 .value == "";到.检查;不幸的是，该代码不再允许删除一个空的任务操作块。是否可以定义 .checked == false ？
那么你将只检查元素的存在，而不是检查状态或值。
你很有耐心！所以， .checked == false 只会验证是否有一个复选框？在函数中我需要知道有一个复选框并且它是空的......

【解决方案2】：

所以，如果您想检查复选框字段的existence，那么您需要

  document.getElementById('completed_' + nr)

如果您需要checked 或not checked 复选框的值

  document.getElementById('completed_' + nr).value

如果复选框是checked，则需要该值

  ( document.getElementById('completed_' + nr).checked && document.getElementById('completed_' + nr).value!=='' )

注意括号。这将仅在 both 情况为真时返回真。

【讨论】：