1

我正在尝试创建一种简单的方法来强制单个复选框在未选中或单击关闭的情况下在表单提交中显示“否”。我尝试了多种方法，这是我能得到的最接近的方法，但它仍然无法正常工作。

任何帮助深表感谢。马特

$(function opt() {
        if ($("#optIn").is(":checked")) {
            $("#optIn").value="Yes"
            $("#optIn").click(function() { this.value="No" })
        } else {
            $("#optIn").value="No"
            $("#optIn").click(function() { this.value="Yes" })
        }
    return false
});

opt();
4

3 回答 3

7

未选中的复选框不是一个成功的控件，因此不会与其余的表单数据一起发布。

最简单的解决方案是创建一个与复选框同名的隐藏输入，其中包含“未选中”值：

<input type="hidden" name="myCheckbox" value="No" />
<input type="checkbox" name="myCheckbox" value="Yes" />

myCheckbox=No如果未选中该复选框，这将导致表单 POST 。

于 2012-05-16T01:14:04.473 回答
4

所以坦率地说，我不确定你以前在哪里看到过这种功能设置。您的代码按原样可以简化为：

$(function() { // on DOM ready (when the DOM is finished loading)
    $('#optIn').click(function() { // when the checkbox is clicked
        var checked = $('#optIn').is(':checked'); // check the state
        $('#optIn').val(checked ? "Yes" : "No"); // set the value
    });
    $('#optIn').triggerHandler("click"); // initialize the value
});

但是value，复选框的 永远不会显示在屏幕上。您可能需要使用值“是”或“否”更新单独的字段，例如：

<input type="checkbox" id="optIn" />
<span id="optInLabel"/>No</span>

和脚本：

$(function() { // on DOM ready (when the DOM is finished loading)
    $('#optIn').click(function() {
        optIn(this);
    });
    optIn($('#optIn')[0]);
});

function optIn(el) {
    var checked = $(el).is(':checked'); // check the state
    $('#optInLabel').html(checked ? "Yes" : "No"); // set the value
}

编辑：工作 jsFiddle

如果您需要检查是否在服务器端提交表单后选中该框，那么您还可以使用值“是”或“否”更新隐藏的输入字段并忽略提交的复选框元素值（jaredhoyt如前所述在他的回答中）。

于 2012-05-16T01:13:33.143 回答
0

使用单选按钮：

<span>Opt in?</span>
<br>
<input type="radio" name="optIn" value="no" checked>No&nbsp;
<input type="radio" name="optIn" value="yes">Yes

不需要 javascript，适用于所有浏览器，没有垫片，没有库，什么都没有。

于 2012-05-16T02:18:20.550 回答