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");
    }
   });
});

小提琴：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

在您的代码中，您使用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 3

Select没有attr 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);
        }
    });
});

btw open不是变量，而是值，因此需要在引号"opel"中并且小提琴：http://jsfiddle.net/xKQUd/5/

Answer 4

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 5

尝试

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

FIDDLE Demo

Answer 6

试试这个，

if (x == "opel") {

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

Answer 7

尝试以下代码：

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

}）;

javascript在下拉值更改时设置readonly属性

8 个答案: