1

我正在使用 Foundation 4 框架，并在我的页面中添加了一个自定义表单。

HTML： 

<label for="checkbox2">
<input type="checkbox" id="checkbox2" style="display: none;">
<span class="custom checkbox"></span> <p> CHECKBOX TEST</p>
</label>

JS： 

if($('#checkbox2').is(":checked")){
   isnewsletter = 1;
} else {
   isnewsletter = 0;
}

甚至这个 

newsletter = $('#checkbox2').val(),

不工作。
如果我的复选框被选中，我该如何检查？

4

3 回答 3

1 
$('#checkbox2').change(function(){
  if($(this).is(":checked")){
     console.log(1);
  } else {
     console.log(0);
  }
});
于 2013-09-14T03:39:53.003 回答
0

问题不是很清楚 OP 是否要检查复选框是否：检查更改，在页面交互期间的任何随机时刻，或使用 Foundation 4 Abide 库进行验证。我遇到了自定义表单和切换隐藏字段以及验证隐藏字段的问题，而自定义表单没有帮助。但是，我已经解决了它，但这些是不同的问题。

默认情况下，“自定义”表单会隐藏输入并在其之后创建一个跨度，以“选中”类，并且隐藏复选框上的属性不会直观地出现在 Chrome 的开发人员工具栏中（我没有检查 FireBug 以查看如果该属性出现）。但是，如果您编写基于代码的复选框属性检查，它将返回“true”：

$("#checkbox2").change(function() {
    console.log($(this).is(":checked"));
    console.log($(this).prop('checked'));
    // set up if using either method above, your choice.
    if( $(this).prop('checked')) {
        // do stuff
    }
});

或者您可以在输入“checked”类之后直接检查 span.checkbox.custom：

$("#checkbox2").change(function() {
    console.log($(this).next().hasClass("checked"));
    // set up if statement using that logic above:
    if($(this).next().hasClass("checked") ) {
        // do stuff
    }
});

使用相同的逻辑来检查复选框是否在任何时候被选中，只是不要打扰 .change() 函数。如果选中该框，这些将返回 true：

$("#checkbox2").next().hasClass("checked");
$("#checkbox2").is(":checked");
$("#checkbox2").prop("checked");

Foundation 4 没有在 Abide 中内置验证，您必须将其添加进去。

这需要调整Abide。

我在这里回答了这个问题。

于 2014-04-22T22:31:03.820 回答
0

第一次检查工作正常。如果您添加checked="checked"到您的复选框isnewsletter将是1.
PS你没有提到你在程序中勾选复选框的任何其他方式。您的复选框未显示在页面上，因此您无法手动勾选它。

于 2013-07-31T04:26:10.280 回答