0

I have this select:

<select>
    <option class="1">1st</option>
    <option class="2">other1</option>
    <option class="2">other2</option>
    <option class="1">2st</option>
    <option class="2">other1</option>
    <option class="2">other2</option>
</select>

How can I disable the options with class "1"?

max-m
  • 847
  • 7
  • 9
golaz
  • 71
  • 7
  • Just a sidenote, your class names are invalid, have a look at http://stackoverflow.com/a/449000/1112384 – max-m Feb 23 '14 at 15:00

2 Answers2

5
<select>
<option class="1">1st</option>
<option class="2">other1</option>
<option class="2">other2</option>
<option class="1">2st</option>
<option class="2">other1</option>
<option class="2">other2</option>
</select>

<script>
$(function(){
    $('select').find('option.1').attr('disabled', 'disabled');
});
</script>

Note: Your class names are not following convention

Naming rules:

  1. Must begin with a letter A-Z or a-z
  2. Can be followed by: letters (A-Za-z), digits (0-9), hyphens ("-"), and underscores ("_")
  3. In HTML, all values are case-insensitive
gurudeb
  • 1,856
  • 22
  • 29
1

Using jQuery, you can do the following (whereas c1 is a valid replacement for 1) 

jQuery("option.c1").attr("disabled", "disabled");

This fetches all elements of tag option that have a class of c1 set and, for each matched tag, the attribute disabled is added with value disabled (this is common practice, as disabled does not really need an argument, but XML requires an argument for attributes).

Abrixas2
  • 3,207
  • 1
  • 20
  • 22