如何在没有表单的情况下创建复选框

Question

我一直在尝试制作一个像这样有3个字段的简单应用程序：

    <div id = "nameInput" >Name:</div><input id = "nameInputField" type = "text" name = "userName" />
    <div id = "emailInput" >Email:</div><input id = "emailInputField" type = "text" name = "email" />
    <input id = "termsCheck" type = "checkbox" name = "terms" />

我遇到的问题是为了让复选框在被选中时被识别为已选中，我不得不尝试将其包装在一个表单中。然而，我并不想使用表单，因为我永远不想提交任何内容。

以下是复选框的JS代码。它始终被标记为未选中：

if ($('#terms').checked == true) {
    //Rest of code

有没有一种方法可以不使用表单来完成这个，或者我的复选框永远不会被注册为选中的原因是什么？

- Soatl

---

我假设你正在使用jQuery，基于你问题中的代码。 - Naftali

为什么你不想使用表单？输入被定义为始终是表单的一部分。 - Dennis G

我一直遇到表单始终提交的问题。我认为没有表单会更容易。我也很好奇是否可能。 - Soatl

你可以将其放入一个表单中，而不包括提交按钮。 - Jason Gennaro

Answer 1

<input id = "termsCheck" type="checkbox" name="terms" />

JS：

jQuery 1.6之前：

if($('#termsCheck').is(':checked')){}

jQuery 1.6之后：

if($('#termsCheck').prop('checked')){}

- Naftali

Answer 2

有两个问题。

首先，你引用的是输入框的名称而不是它的ID。

其次，要使用checked属性，必须在DOM元素上进行操作，而不是jQuery对象。

if( $('#termsCheck')[0].checked ) {
    // ...
}

这是访问jQuery对象中索引为0的DOM元素，然后访问它的checked属性。

你也可以使用get()^[文档]方法来检索DOM元素。

if( $('#termsCheck').get(0).checked ) {
    // ...
}

- user113716

Answer 3

如果您不想使用jQuery，您可以尝试以下方法：

<input id = "termsCheck" type = "checkbox" name = "terms" />

同时，可以通过以下方式引用它：

if (document.getElementById("termsCheck").checked) {
}

- Tim Erickson

---

如果你把 getElementByID 改成 getElementById，它就可以完美地工作了。 - Edmundo Del Gusto

Answer 4

你需要以不同的方式检查选中状态

$('#terms').is(":checked")

- hunter

Answer 5

jQuery对象（我假设您正在使用）没有一个已选字段，因此将填充为false。

您可以做的是

 $("#terms").is(":checked")

- megakorre