问题 Twitter bootstrap选择readonly仍然可以更改选项


我有一个bootstrap选择 readonly="true" 但我仍然可以更改所选的选项。

我需要的 disabled="true" 行为,但当我使用它时,不提交选择。

我需要2的组合,所选的选项无法更改,但必须提交选择。

我可以使用隐藏字段,但我希望有一个更简单的解决方案。


4657
2017-09-29 14:38


起源

我不相信任何选择的替换插件会有这种行为,作为标准 select 元素不支持它。如果您需要它,您很可能需要自己编写代码,或者如您所说,禁用元素并使用隐藏的输入。 - Rory McCrossan


答案:


另一种可能是使用带有下拉列表的选择替换,应该可以禁用下拉列表但仍然提交隐藏的选择元素的值。 但是你也可以使用隐藏的字段......

或者,如果禁用了select元素,您实际上会添加一个带有所选值的隐藏字段。

<input type="hidden" name="whatever">
<select name="whatever">

如果隐藏字段与select具有相同的名称,则select的所选值应覆盖隐藏字段的提交值(例如,当使用js动态启用选择字段时)。如果禁用选择,则发送隐藏字段的值。 不确定首先提交的内容的顺序。

$(document).ready(function(){$('select option:not(:selected)').attr('disabled',true);});

这个解决方案也应该工作(至少启用了js)。它禁用每个未选择的选项。因此,所选选项已提交,无法更改。

有一个类似的,已经回答的问题 HTML的形式,只读选标签输入 


5
2017-09-29 17:25



谢谢我用你最后的解决方案:$('select [readonly]选项:not(:selected)')。attr('disabled',true); - Ruben
你还可以高亮显示你对其他帖子的链接,答案比我的更完整,也许我的是重复的? - Ruben


我遇到了类似的问题,我所做的是当触发表单onsubmit事件时删除已禁用的属性,因为浏览器不会将禁用的属性发送回服务器。

$('form').submit(function () { $('[disabled]').removeAttr('disabled'); })

正如您所提到的,我发现的唯一其他选项是找到隐藏输入的值。


8
2017-09-29 15:24





在页面加载时将禁用添加到只读

$('[readonly]').prop( "disabled", true );

在提交删除禁用之前

$('[readonly]').prop( "disabled", false );

来自Jquery doc的注释:

从jQuery 1.6开始,.attr()方法为属性返回undefined   没有设定。检索和更改DOM属性,例如   选中,选中或禁用表单元素的状态,使用   .prop()方法。


1
2017-11-02 10:20