4

How would I get an equivalent placeholder in a select option? For example when you have a select list it may say in the field "City" then when clicking that it would show all cities in the options.

  • This link will help you https://stackoverflow.com/questions/5805059/how-do-i-make-a-placeholder-for-a-select-box?rq=1 – zahra zamani Oct 04 '20 at 13:44

2 Answers2

3

I think this is what you want .

HTML:

<select id="choice">
  <option value="0" selected="selected">Choose...</option>
  <option value="1">Something</option>
  <option value="2">Something else</option>
  <option value="3">Another choice</option>
</select>

CSS :

#choice option { color: black; }
.empty { color: gray; }

JavaScript:

$("#choice").change(function () {
  if($(this).val() == "0") $(this).addClass("empty");
  else $(this).removeClass("empty")
});

$("#choice").change();

try this jsfiddle.

2

Don't know if this is what you are looking for

<select>
    <option value="" disabled selected>Select your option</option>
    <option value="value1">Value 1</option>
    <option value="value2">Value 2</option>
    <option value="value3">Value 3</option>
</select>
user3811714
  • 286
  • 2
  • 8
  • 21
  • I have to admit, I didn't ever consider the possibility of applying 'disabled' to an individual option. I hope that has all the intended effects, and no major consequences... – Katana314 Dec 11 '14 at 15:25