javascript - 当下拉值更改时将属性设置为只读

Question

我的下拉菜单有 4 个选项。

我想要实现的是，当用户从下拉列表中选择option3或option4时，将输入文本number的属性更改为只读.

<select id="s_id">
    <option value="option1">option1</option>
    <option value="option2">option2</option>
    <option value="option3">option3</option>
    <option value="option4">option4</option>
</select>

number: <input type="text" name="number">

这是我现在拥有的脚本，它的作用只是提醒所选值。

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

JS Fiddle link

任何想法将不胜感激!

Answer 1

使用prop使只读并将其删除

<强> DEMO

$(document).ready(function () {
    $("#s_id").change(function () {
    if (this.value === 'option3' || this.value === 'option4')
        $("input[name='number']").prop('readonly', true);
    else
        $("input[name='number']").prop('readonly', false);//enable it back again
    });
});