2014-01-27 2 views
0

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

Если из выпадающего меню выбрано «Мерседес», то ввод текста должен быть включен (обратите внимание, что в реальной системе нет имен классов или идентификаторов, поэтому мне нужно указать имя формы).

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

Это то, что я до сих пор (Fiddle):

HTML:

Ваш автомобиль:

<select name="car"> 
    <option value=""></option> 
    <option value="volvo">Volvo</option> 
    <option value="saab">Saab</option> 
    <option value="mercedes">Mercedes</option> 
    <option value="audi">Audi</option> 
</select> 
<br> 
What do you like about your Mercedes? 
<input type="text" name="likemercedes"> 

JQuery:

$("input[type='text'][name='likemercedes']").prop('disabled', true); 

if($("input[type='text'][name='car']").val() == "mercedes") 
{ 
    $("input[type='text'][name='likemercedes']").removeAttr('disabled'); 
} 

ответ

5

что-то просто:

$("select[name=car]").change(function() { 
    if (this.value == "mercedes") 
     $("input[name=likemercedes]").prop("disabled", false); 
    else 
     $("input[name=likemercedes]").prop("disabled", true); 
}).change(); 

цепное .change() в конце будет вызывать метод на загрузке страницы.

1

DEMO

$("select[name=car]").on("change", function() { 
    if ($(this).val() == "mercedes") { 
     $("input[type='text'][name='likemercedes']").removeAttr('disabled'); 
    } 
}).trigger('change'); 
0

Ваш автомобиль:

<select abc="facility" > 
    <option value="volvo">Volvo</option> 
    <option value="saab">Saab</option> 
    <option value="mercedes">Mercedes</option> 
    <option value="audi">Audi</option> 
</select> 

<br>What do you like about your Mercedes? 
<input name="test" type="text" id="disabled_input"/> 

$(document).ready(function() { 
    $('#disabled_input').attr('disabled','disabled'); 
    $('select[abc="facility"]').on('change',function(){ 
    var others = $(this).val(); 
     if(others == "mercedes"){   
      $('#disabled_input').removeAttr('disabled'); 
     } 
     else{ 
      $('#disabled_input').attr('disabled','disabled'); 
     } 

    }); 
}); 

JSFiddle

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