Как отключить опцию выбора на основе другого варианта выбора

-1

Сценарий: Я продаю футболку в розовом, темно-синем, черном и маленьком, среднем и большом размерах. У меня есть две коробки для выбора, одна для цвета, а другая для размера. Я продаюсь из средних розовых футболок, поэтому вам нужно отключить эту опцию. Как отключить параметр «Средний», когда выбран «Розовый», но убедитесь, что он активен для других параметров цвета?Как отключить опцию выбора на основе другого варианта выбора

<select name="product[]" id="color"> 
      <option value="Pink">Pink</option> 
      <option value="Navy">Navy</option> 
      <option value="Black">Black</option> 
      </select> 

<select name="product[]" id="size"> 
      <option value="Small">Small</option> 
      <option value="Medium">Medium</option> 
      <option value="Large">Large</option> 
      </select>

У меня был удар по решению этой проблемы, но я не могу заставить ее работать. Мне нужно решение, которое работает с значениями параметров с буквами и пробелами, то есть «Темно-розовый» или «Экстра большой», поскольку значения опций передаются в кассу. Это самый близкий я получил к решению:

function enableElements() 
{ 
if($('#color').val() == "pink"){ 
    $("#size option[value='medium']").attr('disabled',true); 
} 
else $("#size option[value='medium']").attr('disabled',false); 
}

^Это основано на статье здесь: http://www.codeoncall.com/disable-drop-down-list-items-based-on-another-drop-down-selection/.

источник

2014-09-25 charby

возможно дубликат [Как отключить выбор на основе другого выбранного варианта?] (Http://stackoverflow.com/questions/15888444/how-to-disable-select-based-on-other-selected- опция) – melancia

Просто совет в любом случае. Не используйте '.attr()' для этого. Вместо этого используйте '.prop()'. [.prop() vs .attr()] (http://stackoverflow.com/questions/5874652/prop-vs-attr) – melancia

Еще один совет: вам действительно не нужно 'if ... then ... else' для этого. '$ (" # size option [value = 'medium'] "). prop ('disabled', $ ('# color'). val() ==" pink ");' – melancia

Попробуйте это:

$('#color').change(function(e){ 
    if($(this).val() == "Pink"){ 
    $("#size option[value='Medium']").prop('disabled',true); 
    } 
    else { 
    $("#size option[value='Medium']").prop('disabled',false); 
    } 
});

Используйте 'опору' вместо 'ATTR'.

Демо:

http://jsfiddle.net/59knw46r/

источник

2014-09-25 13:19:58 RGS

Удивительно, спасибо. Если бы я хотел отключить несколько опций, то есть размер розового размера и черный размер - маленький и большой - как бы я это сделал? – charby

Вот альтернативный метод:

function enableElements() { 

if ($('#color').val() == "pink") { 
    $("#size").children().each(function() { 
     if ($(this).val() == 'medium') { 
      $(this).prop('disabled',true); 
     } 
    }); 
} else { 
    $("#size").children().each(function() { 
     if ($(this).val() == 'medium') { 
      $(this).prop('disabled',false); 
     } 
    }); 
} 

}

источник

2014-09-25 13:21:00

Вы можете написать этот же код, используя третью строку. – melancia

Да, хорошо известно. Просто пытаясь описать это для него, поэтому у него больше возможностей. –

лучше, или я могу сказать более быстрый подход будет следующим сниппет.

$("#size").find("option[value='Medium']").prop('disabled',true)

источник

2014-09-25 13:21:19 Mayank

Как отключить опцию выбора на основе другого варианта выбора

ответ

Смежные вопросы