复选框 javascript答案

【问题标题】：checkbox javascript复选框 javascript
【发布时间】：2012-04-15 14:04:17
【问题描述】：

有两种选择；英语或非英语。当您不选择其中任何一个或同时选择两者时，它应该给出错误但它没有给出。你能帮忙吗？谢谢。 ps：即使我将它设置为条款和条件的复选框，alert 也不起作用。

JavaScript

function onFormSubmit(form_element) {

        if (form_element.click.checked == false)
                {
                alert("Please check language");
                return false;
                }
    return true;
}

HTML

<form onsubmit="return onFormSubmit(this)">
        Language: <input type="checkbox" name="click" value="english">english
</form>

【问题讨论】：

您是否考虑过使用无线电输入？这样只能选择一个，并且浏览器应该默认检查一个。
是的，我知道这更容易，但它应该是复选框。 :(
“应该是”为什么？对于这个用例，它真的应该是无线电输入。
在JS上尽量不要使用click作为关键字。
在这种情况下，应该选择单选按钮，而不是复选框。将单选按钮和复选框分开的原因是因为这样的情况，必须选择默认选项，并且一次只能选择一个选项。当然，您可以随意设置单选按钮的样式（甚至可以模仿复选框的外观，但这会违反直觉，不是吗？）

标签： javascript validation checkbox

【解决方案1】：

条件应该是……

if ((form_element.click_1.checked == true && form_element.click_2.checked == true) || (form_element.click_1.checked == false && form_element.click_2.checked == false))

编辑

这是我用的。

<script>
function onFormSubmit(form_element) {

        if ((form_element.click_1.checked == true && form_element.click_2.checked == true) || (form_element.click_1.checked == false && form_element.click_2.checked == false))
                {
                alert("Please check language");
                return false;
                }
    return true;
}
</script>


<form onsubmit="return onFormSubmit(this)">
        Language: <input type="checkbox" name="click_1" value="english">english
                  <input type="checkbox" name="click_2" value="non english">non english</p>
<input type="submit">
</form>

【讨论】：

它没有解决问题。当我选择两者或都不选择时，它仍然没有给出任何错误。
当我使用这个条件时，它确实向我显示了这两个条件的警报消息......
它没有显示任何警报。我该怎么写呢？

【解决方案2】：

<form onsubmit="return onFormSubmit(this)">
        Language: <input type="checkbox" name="click_1" value="english">english
                  <input type="checkbox" name="click_2" value="non english">non english</p>
        <input type="submit" />
</form>
<script type="text/javascript">
function onFormSubmit(form_element) {
  if ((form_element.click_1.checked == true && form_element.click_2.checked == true)) {
      alert("Please check only one choice!");
      return false;
  } else if ((form_element.click_1.checked == false && form_element.click_2.checked == false)) {
      alert("Please check your choice!");
      return false;
    }
    return true;
}
</script>

http://jsfiddle.net/ocanal/3AWUp/

【讨论】：

【解决方案3】：

我在您的 HTML 和每个元素的 ID 中添加了一个提交按钮

HTML

<form id="myForm">
        Language: <input id="english" type="checkbox" name="click_1" value="english">english
                  <input id="nonEnglish" type="checkbox" name="click_2" value="non english">non english</p>
<button type="submit">Submit</button>
</form>

我将一个函数附加到执行验证的 onsubmit 事件。 Javascript

document.getElementById("myForm").onsubmit =
function () {
        if ((document.getElementById("english").checked == false && document.getElementById("nonEnglish").checked == false) || (document.getElementById("english").checked == true && document.getElementById("nonEnglish").checked == true))
                {
                alert("Please check language");
                return false;
                }
    return true;
}

演示：http://jsfiddle.net/j3J4E/

【讨论】：

谢谢，但我必须使用原始功能。

【解决方案4】：

问题是“onFormSubmit(this)”——当事件被调用时，“this”不会引用表单。如果您从文档中查找表单，它将正常工作。

<!doctype html>
<html>
<head>
<script type="text/javascript">
function validateForm() {
        var form = document.getElementById("myForm");
        if (!form.language.checked) {
                alert("Please check language");
                return false;
        }
        return true;
}
</script>
</head>
<body>
<form id="myForm" onsubmit="return validateForm()">
        Language: <input type="checkbox" name="language">English</input><br />
        <input type="submit" />
</form>
</body>
</html>

【讨论】：

您确定要使用复选框吗？单选按钮会更好，因为一次只能选择一个。
我将其更改为条件条款，我需要复选框
你的函数不能工作的原因是你叫错了。如果您无法更改功能，请更改表单：
...
已编辑以显示一个工作示例。在 chrome 中测试，它可以工作。