javascript do ustawiania atrybutu readonly na zmianie wartości rozwijanej

Question

po wybraniu wartości z listy rozwijanej, jeśli wybrane wartości są równe określonej wartości, chcę, aby menu rozwijane zostało zmienione na tylko do odczytu, w jaki sposób mogę to zrobić?

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> 

Scenariusz:

$(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

trzeba porównać x na ciąg "opel" i można użyć atrybutu disabled patrz skrzypce tutaj : http://jsfiddle.net/xKQUd/3/

Dla wyjaśnienia: select elementy nie mogą być ustawione na readOnly, trzeba użyć atrybutu disabled

obejść nie może wysyłać do wydania serwera ustaw ukryte wejście równą wartości niepełnosprawnej, która zostanie wysłana na przesyłanie formularza zamiast zobaczyć tę skrzypce tutaj: http://jsfiddle.net/xKQUd/25/

Answer 2

Select nie ma atr ReadOnly - zamiast tego może być disabled tak kod:

$(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); 
     } 
    }); 
}); 

btw open nie jest zmienny, ale wartość, więc musi być w cudzysłowach "opel" i skrzypce: http://jsfiddle.net/xKQUd/5/

Answer 3

Spróbuj

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

FIDDLE Demo

Answer 4

Spróbuj tego,

if (x == "opel") { 

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

Answer 5

W swoim kodzie użyłeś opel jako variable. ale nie jest to variable to jest string. Więc musisz wziąć jako ciąg (w pojedynczym lub podwójnym cudzysłowie).

$(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

lub wziąć zmienny var opel = "opel";.

Try jsfiddle

Answer 6

Select elementy nie mogą być ustawione readonly, ale może być disabled zamiast. Ale w tym przypadku ich wartość nie zostanie przesłana z form.

Masz dwie opcje tutaj.

Jednym z nich jest ustawienie hidden input z wybranej wartości, a następnie wyłączyć select:

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

Drugi, to usunąć wszystkie inne opcje z select, pozostawiając tylko wybrany jeden dostępny:

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

To zależy od Ciebie.

Answer 7

Spróbuj poniższy kod:

<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> 

kod 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

Tutaj jesteś 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();    
    } 
}); 

});