Как в jQuery управлять option-ами select-a?

Question

[eldar_web]

Есть select с option-aми, где value у них с 1 до 3.
Мне нужно, чтобы при каком-то событии (в примере, при нажатии) заблокировать option-ы, у кого
value < 3. То есть, в примере первый и второй option-ы должны заблокироваться. Как это сделать в этом примере codepen.io/anon/pen/vOMEvg?

Answer 1

[Игорь]

https://jsfiddle.net/fbz6m95o/

Comments

[eldar_web]

Профессионально. Ответ и ничего больше. Спасибо!

Answer 2

[Максим Барулин]

разве что циклом по options:

$('select option').each(function(){
    if(this.value < 3)
   {
        $(this).attr('disabled', 'disabled');
   }
});

Comments

[eldar_web]

Не работает. Синтаксис исправил даже равенство поставил: codepen.io/anon/pen/vOMEvg?

[Максим Барулин]

не понял какой синтаксис был исправлен, но в таком виде:

$('button').on('click', function(){
  $('select option').each(function(){
       if(this.value < 3)
        {
        $(this).attr('disabled', 'disabled');
      }
  });
});

всё прекрасно работает

Answer 3

[Никита Баев]

Можно чуть проще (надо будет дописать логику, чтобы отключались все селекты, что меньше текущего):

$('button').on('click', function() {
  var $select = $('select');
  var selectedVal = parseFloat($select.val());
  if (selectedVal === 3) {
    $select.find('option').not('[value="' + selectedVal + '"]').attr('disabled', 'disabled');
  }
});

Answer 4

[chirsss]

Заблокировать конкретный option

$("#select option[value='1']").prop("disabled", true);

Заблокировать option у которых value < 3

$('#select option').filter(function() {
  return this.value < 3;
}).prop("disabled", true);

Примеры взяты здесь