如何将选项元素设置为只读但不禁用选择元素

时间:2020-01-27 05:47:00

标签: javascript jquery html css

我尝试将readonly属性设置为true,但是由于我仍然能够从下拉列表中选择值,因此它无法正常工作。

<tr>
    <td>
        <select name="type" tabindex="0">
            <option value=""></option>
            <option value="first">first</option> 
            <option value="second">second</option>
        </select> 
    </td> 
</tr>

2 个答案:

答案 0 :(得分:3)

您可以在disabled上使用options而不是整个select标签

<select name="type" tabindex="0">
 <option value="" disabled></option>
 <option value="first" disabled>first</option> 
<option value="second" disabled>second</option>
</select> 

答案 1 :(得分:2)

尝试一下。

$(document).ready( function() {
  $('#select').change( function() {
    if($(this).val() !== '')  console.log($(this).val());
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="type" tabindex="0" id="select"> 
     <option value=""></option> 
     <option value="first" disabled>first</option> 
     <option value="second" disabled>second</option>
      <option value="Not disabled">Not disabled</option>
</select>