我认为他们可以,但我没有把我的钱放在我的嘴(这么说)设置只读属性实际上似乎没有做任何事情。

我宁愿不使用Disabled,因为我希望选中的复选框与表单的其余部分一起提交,我只是不希望客户端能够在某些情况下更改它们。


当前回答

尝试将复选框设置为只读,但不允许用户勾选。这将允许您POST复选框的值。为了这样做,您需要选择复选框的默认状态为Checked。

<input type="checkbox" readonly="readonly" onclick="this.checked =! this.checked;">

如果你想要上面的功能+不想接收复选框数据,试试下面的:

<input type="checkbox" readonly="readonly" disabled="disabled" onclick="this.checked =! this.checked;">

希望这能有所帮助。

其他回答

这里的一些答案似乎有点迂回,但这里有一个小技巧。

<form id="aform" name="aform" method="POST">
    <input name="chkBox_1" type="checkbox" checked value="1" disabled="disabled" />
    <input id="submitBttn" type="button" value="Submit" onClick='return submitPage();'>
</form>​

然后在jquery中,你可以选择以下两个选项之一:

$(document).ready(function(){
    //first option, you don't need the disabled attribute, this will prevent
    //the user from changing the checkbox values
    $("input[name^='chkBox_1']").click(function(e){
        e.preventDefault();
    });

    //second option, keep the disabled attribute, and disable it upon submit
    $("#submitBttn").click(function(){
        $("input[name^='chkBox_1']").attr("disabled",false);
        $("#aform").submit();
    });

});

演示: http://jsfiddle.net/5WFYt/

人们喜欢只读复选框和(以及)只读无线电组的主要原因是,不能更改的信息可以以输入的形式显示给用户。

好的,禁用控件就可以做到这一点——不幸的是禁用控件不能用键盘导航,因此违反了所有可访问性法规。这是我所知道的HTML中最大的问题。

READONLY对复选框不起作用,因为它阻止你编辑字段的值,但有了复选框,你实际上是在编辑字段的状态(在||关闭)

从faqs.org:

READONLY只是阻止用户更改字段的值,而不是阻止用户与字段交互,理解这一点很重要。例如,在复选框中,您可以打开或关闭复选框(从而设置CHECKED状态),但不能更改字段的值。

如果不想使用disabled,但仍然想提交值,那么当值不满足编辑条件时,将值作为隐藏字段提交并将其内容打印给用户如何?如。

// user allowed change
if($user_allowed_edit)
{
    echo '<input type="checkbox" name="my_check"> Check value';
}
else
{
    // Not allowed change - submit value..
    echo '<input type="hidden" name="my_check" value="1" />';
    // .. and show user the value being submitted
    echo '<input type="checkbox" disabled readonly> Check value';
}

摘自https://stackoverflow.com/a/71086058/18183749

如果你不能使用'disabled'属性(因为它会擦除值的 input at POST),并注意到html属性'readonly'只工作 在文本区域和一些输入(文本,密码,搜索,据我所见), 最后,如果你不想重复你所有的 您可能会发现,带有隐藏输入逻辑的选择、复选框和单选 下面的函数或任何他的内部逻辑你喜欢:

    addReadOnlyToFormElements = function (idElement) {
        
            // html readonly don't work on input of type checkbox and radio, neither on select. So, a safe trick is to disable the non-selected items
            $('#' + idElement + ' input[type="checkbox"]:not(:checked)').prop('disabled',true); 
     
            // and, on the selected ones, to disable mouse/keyoard events and mimic readOnly appearance
            $('#' + idElement + ' input[type="checkbox"]:checked').prop('tabindex','-1').css('pointer-events','none').css('opacity','0.5');
        }

没有什么比删除这些只读更容易的了

removeReadOnlyFromFormElements = function (idElement) {

    // Remove the disabled attribut on non-selected
    $('#' + idElement + ' input[type="checkbox"]:not(:checked)').prop('disabled',false);

    // Restore mouse/keyboard events and remove readOnly appearance on selected ones
    $('#' + idElement + ' input[type="checkbox"]:checked').prop('tabindex','').css('pointer-events','').css('opacity','');
}

我碰巧注意到下面给出的解决方案。在我的研究中发现了同样的问题。 我不知道是谁发的,但不是我做的。它使用jQuery:

$(document).ready(function() {
    $(":checkbox").bind("click", false);
});

这将使复选框为只读,这将有助于向客户端显示只读数据。