我想显示一个单选按钮,有它的值提交,但根据情况,它是不可编辑的。Disabled不起作用,因为它不提交值(或者它是否提交?),并且它使单选按钮变灰。只读是我真正想要的,但出于某种神秘的原因,它不起作用。

我是否需要使用一些奇怪的技巧来实现只读以达到预期的效果?我应该用JavaScript写吗?

顺便提一下,有人知道为什么只读在单选按钮中不起作用,而在其他输入标签中却起作用吗?这是HTML规范中不可理解的遗漏之一吗?


当前回答

I have a lengthy form (250+ fields) that posts to a db. It is an online employment application. When an admin goes to look at an application that has been filed, the form is populated with data from the db. Input texts and textareas are replaced with the text they submitted but the radios and checkboxes are useful to keep as form elements. Disabling them makes them harder to read. Setting the .checked property to false onclick won't work because they may have been checked by the user filling out the app. Anyhow...

onclick="return false;"

工作就像一个“禁用”无线电和复选框事实上的魅力。

其他回答

摘自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="radio"]:not(:checked)').prop('disabled',true); 

    // and, on the selected ones, mimic readonly appearance
    $('#' + idElement + ' input[type="radio"]:checked').css('opacity','0.5');
}

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

removeReadOnlyFromFormElements = function (idElement) {
    // Remove the disabled attribut on non-selected
    $('#' + idElement + ' input[type="radio"]:not(:checked)').prop('disabled',false); 
 
    // Remove readonly appearance on selected ones
    $('#' + idElement + ' input[type="radio"]:checked').css('opacity','');
}

在JS中捕获一个“On_click()”事件并像这里一样检查它怎么样?:

http://www.dynamicdrive.com/forums/showthread.php?t=33043

我发现使用onclick='this。Checked = false;'在一定程度上起了作用。单击的单选按钮将不会被选中。然而,如果有一个单选按钮已经被选中(例如,一个默认值),该单选按钮将变为未选中。

<!-- didn't completely work -->
<input type="radio" name="r1" id="r1" value="N" checked="checked" onclick='this.checked = false;'>N</input>
<input type="radio" name="r1" id="r1" value="Y" onclick='this.checked = false;'>Y</input>

在这种情况下,保持默认值不变并禁用其他单选按钮将保留已经选中的单选按钮,并防止不选中它。

<!-- preserves pre-selected value -->
<input type="radio" name="r1" id="r1" value="N" checked="checked">N</input>
<input type="radio" name="r1" id="r1" value="Y" disabled>Y</input>

这个解决方案并不是防止默认值被更改的最优雅的方法,但无论是否启用javascript,它都是有效的。

对于未选中的单选按钮,将它们标记为禁用。这将阻止它们响应用户输入并清除选中的单选按钮。例如:

<input type="radio" name="var" checked="yes" value="Yes"></input>
<input type="radio" name="var" disabled="yes" value="No"></input>

尝试禁用属性,但我认为您不会得到单选按钮的值。 或者像这样设置图像:

<img src="itischecked.gif" alt="[x]" />radio button option

致以最亲切的问候。