当将一个HTML复选框发布到服务器时，它有一个字符串值'on'或''。

Readonly不会停止用户编辑复选框，disabled会停止返回的值。 解决这个问题的一种方法是使用一个隐藏元素来存储实际值，而显示的复选框是一个禁用的dummy。通过这种方式，复选框状态在帖子之间被持久化。

这是一个函数。它使用'T'或'F'的字符串，你可以以任何你喜欢的方式更改它。这是在一个ASP页面中使用的使用服务器端的VB脚本。

public function MakeDummyReadonlyCheckbox(i_strName, i_strChecked_TorF)

    dim strThisCheckedValue

    if (i_strChecked_TorF = "T") then
        strThisCheckedValue = " checked "
        i_strChecked_TorF = "on"
    else
        strThisCheckedValue = ""
        i_strChecked_TorF = ""
    end if

    MakeDummyReadonlyCheckbox = "<input type='hidden' id='" & i_strName & "' name='" & i_strName & "' " & _
        "value='" & i_strChecked_TorF & "'>" & _
    "<input type='checkbox' disabled id='" & i_strName & "Dummy' name='" & i_strName & "Dummy' " & _
        strThisCheckedValue & ">"   
end function

public function GetCheckbox(i_objCheckbox)

    select case trim(i_objCheckbox)

        case ""
            GetCheckbox = "F"

        case else
            GetCheckbox = "T"

    end select

end function

在ASP页面的顶部，你可以提取持久值…

strDataValue = GetCheckbox(Request.Form("chkTest"))

当你想输出你的复选框时，你可以这样做…

response.write MakeDummyReadonlyCheckbox("chkTest", strDataValue)

我已经测试过了，它工作得很好。它也不依赖于JavaScript。

另一个“简单的解决方案”:

<!-- field that holds the data -->
<input type="hidden" name="my_name" value="1" /> 
<!-- visual dummy for the user -->
<input type="checkbox" name="my_name_visual_dummy" value="1" checked="checked" disabled="disabled" />

禁用=“禁用” / 禁用=真

最新的jQuery有这个特性

$("#txtname").prop('readonly', false);

你总是可以使用一个小图像，看起来像一个复选框。

只需使用如下所示的简单禁用标签。

<input type="checkbox" name="email"  disabled>

摘自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','');
}