Блог

Мне нужно проверить, выбирает ли пользователь определенное значение в выпадающем меню. Если это значение выбрано, мне нужно, чтобы оно изменило выбор другого выпадающего меню.

Вот html для первого выпадающего списка. Если выбрано значение Quarterly, мне нужно, чтобы Quarterly был выбран во 2-м выпадающем списке. Если выбрано что-либо еще, изменений не будет.

 <select id="frequency" name="frequency">
  <option selected="selected" value="">Select One</option>
  <option value="Monthly">Monthly</option>
  <option value="Quarterly">Quarterly (1 Year Minimum, 4 deliveries)</option>
</select>


   <select id="MonthPlan" name="MonthPlan">
      <option selected="selected" value="">Select One</option>
      <option value="3Months">3 Months</option>
      <option value="6Months">6 Months</option>
      <option value="9Months">9 Months</option>
      <option value="12Months">12 Months</option>
      <option value="Quarterly">Quarterly (1 Year Minimum, 4 deliveries)</option>
    </select>
  

 $('#frequency').change(function(){
    if($(this).val() === 'Quarterly'){
        $('#MonthPlan').val('Quarterly');
    }
});
  

Вот jsFiddle кода.

Проверьте этоhttp://jsfiddle.net/fQZwb /

или просто код jQuery:

 $(document).ready(function(){

var frequency = $('#frequency');
var MonthPlan = $('#MonthPlan');

frequency.bind("change", function(){
    if ($(this).val() == 'Quarterly') {
       MonthPlan.find('option[value="Quarterly"]').attr('selected', 'selected');
    } else {
       MonthPlan.find('option[value=""]').attr('selected', 'selected'); 
    } 
});
  

});

Вы запрашивали совпадения только на основе одного значения (ежеквартально), но если в будущем вы можете добавить дополнительные элементы, которые должны вызывать автоматический выбор, вы могли бы избежать жесткого кодирования и использовать что-то вроде этого:

 $('#frequency').change(function() {
    var frequency = this.value;
    $('#MonthPlan option').each(function() {
        if (this.value === frequency) {
            $('#MonthPlan').val(this.value);
        }
    });
});
  

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

 $('#frequency').change(function() {
    var frequency = this.value;
    $('#MonthPlan option').each(function() {
        var monthPlan = $('#MonthPlan');
        monthPlan.removeAttr('disabled');

        if (this.value === frequency) {
            monthPlan.val(this.value);
            monthPlan.attr('disabled', 'disabled');
        }
    });
});
  

Для справки: jsFiddle этого метода

Что-то вроде этого :

 <select id="frequency" name="frequency" onChange="selectChange()">
  

И в javascript :

 function selectChange()
{
    if($("#frequencyoption:selected").val() == "Quarterly")
        $("#frequencyoption").val("Quarterly");

}