javascript для установки атрибута readonly при изменении значения выпадающего списка

Question

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

HTML:

<select id="s_id"> 
    <option value="volvo">Volvo</option> 
    <option value="saab">Saab</option> 
    <option value="opel">Opel</option> 
    <option value="audi">Audi</option></select> 

Сценарий:

$(document).ready(function() { 
    $("#s_id").change(function() { 
    var x = $(this).val(); 
    //alert("something's changed"); 
    alert($(this).val()); 
    if (x === opel) { 
     alert("iff only....."); 
     $(this).attr("readOnly", "true"); 
    } 
    }); 
}); 

Fiddle: http://jsfiddle.net/L4reds/xKQUd/2/

Answer 1

Вам нужно сравнить x в строку "opel", и вы можете использовать атрибут disabled см скрипку здесь : http://jsfiddle.net/xKQUd/3/

Для уточнения: select элементы не могут быть установлены в readOnly, необходимо использовать атрибут disabled

Чтобы вокруг не отсылка к вопросу сервера, установить скрытый вход, равный значению инвалидов, которое будет отправлено на форме представления вместо просмотра этой скрипки здесь: http://jsfiddle.net/xKQUd/25/

Answer 2

Select не атр ReadOnly - вместо этого он может быть disabled поэтому код:

$(document).ready(function() { 
    $("#s_id").change(function() { 
     var x = $(this).val(); 
     //alert("something's changed"); 
     alert($(this).val()); 
     alert("x=======" +x); 
     if (x == "opel") { 
      alert("iff"); 
      // $(this).attr("readOnly", "true"); 
      $(this).attr('disabled',true); 
     } 
    }); 
}); 

кстати open не является переменной, но значение, так должно быть в кавычках "opel" и скрипку: http://jsfiddle.net/xKQUd/5/

Answer 3

Попробуйте

if (x == 'opel') { 
     alert("iff"); 
     $(this).attr("disabled", "true"); 
    } 

FIDDLE Demo

Answer 4

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

if (x == "opel") { 

      $(this).attr("disabled", "disabled"); 
     } 

Answer 5

В вашем коде вы использовали opel как variable. но это не variable это string. Поэтому вам нужно взять строку (в одиночных или двойных кавычках).

$(document).ready(function() { 
    $("#s_id").change(function() { 
     var x = $(this).val();    
     alert($(this).val()); 
     alert("x=======" +x); 
     if (x == "opel") { 
      alert("iff"); 
      $(this).attr("disabled", "disabled"); 
     } 
    }); 
}); 

Try this jsfiddle

или взять переменную var opel = "opel";.

Try jsfiddle

Answer 6

Select элементы не могут быть установлены readonly, но может быть disabled вместо этого. Но в этом случае их значение не будет отправлено с form.

У вас есть два варианта.

Один установить hidden input с выбранным значением, а затем отключить select:

$(document).ready(function() { 
    $("#s_id").on("change", function() { 
     if ($(this).val() === "opel") { 
      $("#myHiddenField").val($(this).val()); 
      $(this).attr("disabled", "disabled"); 
     } 
    }); 
}); 

Другой, чтобы удалить все другие варианты из select, оставляя только выбранный один доступный:

$(document).ready(function() { 
    $("#s_id").on("change", function() { 
    if ($(this).val() === "opel") { 
     $(this).children("option").each(function() { 
      if (this.value != "opel") 
       this.remove(); 
     }); 
    } 
    }); 
}); 

Это зависит от вас.

Answer 7

Try Ниже Код:

<select id="s_id"> 
<option value="volvo">Volvo</option> 
<option value="saab">Saab</option> 
<option value="opel">Opel</option> 
<option value="audi">Audi</option> 
</select> 

Jquery код:

$(document).ready(function() { 
$("#s_id").change(function() { 
var x = $(this).val();  
if (x == 'opel') { 
    $(this).attr('disabled','disabled'); 
} 
}); 
}); 

http://jsfiddle.net/Ea6NN/

Answer 8

Здесь вы http://jsfiddle.net/SteveRobertson/xKQUd/24/

 $(document).ready(function() { 
      y=1; 
      $("#s_id").change(function() { 
      var x = $(this).val(); 
    //alert("something's changed"); 


      if (x == "opel" && x!=y) {   
       y=x; 
       $("#s_id").prop("disabled", true).change();    
    } 
}); 

});