如何确保<select>表单字段被禁用时提交?

我有一个选择表单字段，我想标记为“readonly”，因为用户不能修改该值，但该值仍然与表单一起提交。使用disabled属性可以防止用户更改值，但不会将值与表单一起提交。

readonly属性仅适用于输入和文本区域字段，但这基本上是我想要的。有办法让它工作吗?

我考虑的两种可能性包括:

不是禁用选择，而是禁用所有选项，并使用CSS将选择变成灰色，这样它看起来就像禁用了一样。向提交按钮添加单击事件处理程序，以便在提交表单之前启用所有禁用的下拉菜单。

当前回答

<select id="example">
    <option value="">please select</option>
    <option value="0" >one</option>
    <option value="1">two</option>
</select>



if (condition){
    //you can't select
    $("#example").find("option").css("display","none");
}else{
   //you can select
   $("#example").find("option").css("display","block");
}

2016-12-27 08:15:06

其他回答

与Tres建议的解决方案相同，但不使用jQuery

<form onsubmit="document.getElementById('mysel').disabled = false;" action="..." method="GET">

   <select id="mysel" disabled="disabled">....</select>

   <input name="submit" id="submit" type="submit" value="SEND FORM">
</form>

这可能有助于人们更好地理解，但显然不如jQuery灵活。

2011-11-10 11:47:21

<select id="example">
    <option value="">please select</option>
    <option value="0" >one</option>
    <option value="1">two</option>
</select>



if (condition){
    //you can't select
    $("#example").find("option").css("display","none");
}else{
   //you can select
   $("#example").find("option").css("display","block");
}

2016-12-27 08:15:06

另一种选择是使用readonly属性。

<select readonly="readonly">
    ....
</select>

对于readonly，值仍然被提交，输入字段是灰色的，用户不能编辑它。

编辑:

引自http://www.w3.org/TR/html401/interact/forms.html#adef-readonly:

只读元素接收焦点，但用户不能修改。选项卡导航中包含只读元素。只读元素可能会成功。

当它说元素可能成功时，这意味着它可能被提交，如这里所述:http://www.w3.org/TR/html401/interact/forms.html#successful-controls

2009-10-16 22:54:20

我一直在寻找一个解决方案，因为我没有找到一个解决方案在这个线程我做了我自己。

// With jQuery
$('#selectbox').focus(function(e) {
    $(this).blur();
});

很简单，当你关注它的时候，你只是模糊了这个域，就像禁用它一样，但是你实际上发送了它的数据。

2012-09-14 01:18:46

对于选择字段，它不能使用:input选择器，使用这个:

    jQuery(function() {

    jQuery('form').bind('submit', function() {
        jQuery(this).find(':disabled').removeAttr('disabled');
    });

    });

2013-01-25 07:47:51

如何确保<select>表单字段被禁用时提交?

推荐文章

最新文章

标签