Blank HTML SELECT without blank item in dropdown list
Solution 1:
Just use disabled and/or hidden attributes:
<option selected disabled hidden style='display: none' value=''></option>
-
selected
makes this option the default one. -
disabled
makes this option unclickable. -
style='display: none'
makes this option not displayed in older browsers. See: Can I Use documentation for hidden attribute. -
hidden
makes this option to don't be displayed in the drop-down list.
Solution 2:
You can by setting selectedIndex
to -1
using .prop
: http://jsfiddle.net/R9auG/.
For older jQuery versions use .attr
instead of .prop
: http://jsfiddle.net/R9auG/71/.
Solution 3:
Simply using
<option value="" selected disabled>Please select an option...</option>
will work anywhere without script and allow you to instruct the user at the same time.
Solution 4:
<select>
<option value="" style="display:none;"></option>
<option value="0">aaaa</option>
<option value="1">bbbb</option>
</select>