我有一个选择表单字段，我想标记为“readonly”，因为用户不能修改该值，但该值仍然与表单一起提交。使用disabled属性可以防止用户更改值，但不会将值与表单一起提交。
readonly属性仅适用于输入和文本区域字段，但这基本上是我想要的。有办法让它工作吗?
我考虑的两种可能性包括:
不是禁用选择，而是禁用所有选项，并使用CSS将选择变成灰色，这样它看起来就像禁用了一样。 向提交按钮添加单击事件处理程序，以便在提交表单之前启用所有禁用的下拉菜单。
当前回答
我发现最简单的方法是创建一个小的javascript函数绑定到你的表单:
function enablePath() {
document.getElementById('select_name').disabled= "";
}
你在这里的表格中称它为
<form action="act.php" method="POST" name="form_name" onSubmit="enablePath();">
或者你可以在你用来检查你的表单的函数中调用它:)
其他回答
另一种选择是使用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
在提交前添加一行即可。
$（“#XYZ”）.removeAttr（“disabled”）;
基于Jordan的解决方案，我创建了一个函数，它自动创建一个隐藏输入，该输入具有与您希望无效的select相同的名称和相同的值。第一个参数可以是id或者jquery元素;第二个是布尔可选参数，其中“true”禁用输入，“false”启用输入。如果省略，第二个参数将在“enabled”和“disabled”之间切换选择。
function changeSelectUserManipulation(obj, disable){
var $obj = ( typeof obj === 'string' )? $('#'+obj) : obj;
disable = disable? !!disable : !$obj.is(':disabled');
if(disable){
$obj.prop('disabled', true)
.after("<input type='hidden' id='select_user_manipulation_hidden_"+$obj.attr('id')+"' name='"+$obj.attr('name')+"' value='"+$obj.val()+"'>");
}else{
$obj.prop('disabled', false)
.next("#select_user_manipulation_hidden_"+$obj.attr('id')).remove();
}
}
changeSelectUserManipulation("select_id");
我发现最简单的方法是创建一个小的javascript函数绑定到你的表单:
function enablePath() {
document.getElementById('select_name').disabled= "";
}
你在这里的表格中称它为
<form action="act.php" method="POST" name="form_name" onSubmit="enablePath();">
或者你可以在你用来检查你的表单的函数中调用它:)
<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");
}
