опция изменения атрибутов на основе другой опции

Question

У меня есть 2 drop downs. Первый снимок - это цвет дизайна. Второй - это то, что будет напечатан на проекте. Иногда у нас есть красные рисунки, но они не могут быть напечатаны на красных обертках, поскольку цвета будут смешиваться. Я пытаюсь разделить первый вариант, чтобы дать мне цвет, который он есть, и если он соответствует опции снизу, чтобы отключить его. Когда будет выбран другой параметр, будет отключена опция отключена.

Моя идея состояла в том, чтобы создать строку и использовать ее, чтобы узнать, находится ли она в имени параметра. Кажется, он не работает, поэтому я думаю, что мне не хватает чего-то маленького. Если я заменю «str» на «красный», например, он отключит красный цвет, но он не будет работать «на лету», и это то, что мне нужно для этого. Любая помощь будет принята с благодарностью.

Это часть, где я борюсь: $ (designColor) .children ('option: contains (str)'). Attr ('disabled', 'disabled');

<p> 
<select onchange="change_option('SELECT___LX-03675___185',this.options[this.selectedIndex].value)" name="SELECT___LX-03675___185"> 
<option selected="" value="0">Choose Water Bottle WRAP Color</option> 
<option value="1343">Black Water Bottle</option> 
<option value="1052">Green Water Bottle</option> 
<option value="1874">Purple Water Bottle</option> 
<option value="1051">Red Water Bottle</option> 
<option value="1053">Royal Water Bottle</option> 
<option value="1813">Pink Water Bottle</option> 
</select><br> 
<select onchange="change_option('SELECT___LX-03675___529',this.options[this.selectedIndex].value)" name="SELECT___LX-03675___529"> 
<option selected="" value="0">Choose Water Bottle DESIGN Color</option> 
<option value="2519">Pink Design Water Bottle</option> 
<option value="2520">Red Design Water Bottle</option> 
<option value="2521" disabled="disabled">White Design Water Bottle</option> 
<option value="2522">Black Design Water Bottle</option> 
<option value="2523">Blue Design Water Bottle</option> 
</select> 
</p> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 

var wrapColor = $('select[name=SELECT___LX-03675___185]'); 
var designColor = $('select[name=SELECT___LX-03675___529]'); 

$(wrapColor).change(function() { 
     var str = ""; 
     $(wrapColor).children("option:selected").each(function() { 
      str += $(this).text().split(' ')[0] + " "; 
      }); 


$(designColor).children('option').removeAttr('disabled'); 
$(designColor).children('option:contains(str)').attr('disabled','disabled'); 

    }) 
    .trigger('change'); 
}); 
</script> 

Answer 1

Я думаю, что это должно быть (не тестировалось)

$(designColor).children('option:contains('+str+')').prop('disabled',true);