如何从下拉值onchange中删除输入属性?

时间:2015-11-14 13:16:40

标签: javascript jquery

我的表单中有两个表单元素,如下所示。

<div class="col-xs-12 col-sm-9">
    <select class="input-medium"  name="state">
        <option value="0">-----------</option>
        <option value="ACT">ACT</option>
        <option value="NSW">NSW</option>
        <option value="VIC">VIC</option>
    </select>
</div>

<div class="form-group">
    <label class="control-label" for="suburb">Suburb:</label>
    <div class="col-xs-12 col-sm-9">
        <input type="text" name="suburb" id="suburb" class="col-xs-12 col-sm-4" disabled>
    </div>
</div>

我的问题是,只有当用户从下拉列表中选择一个选项时,我才需要从disabled中删除input属性。

这是我尝试的方式:

$('#state').on('change',function(){
    var inp = $('#suburb').get(0);
    if(inp.hasAttribute('disabled')) {
        inp.removeAttribute('disabled');
    }
    else {
        inp.setAttribute('disabled' , 'disabled');
    }
});

但这不适合我。希望有人可以帮助我。

1 个答案:

答案 0 :(得分:2)

我改变了你的代码;

首先,我添加了组合框的id字段,然后删除了获取第一个语法以使用jquery,并将所有与属性相关的值更改为prop。

<select class="input-medium" id="state"  name="state">

我也测试了,这是有效的。

var inp = $('#suburb');
if($('#state').val() == '0') {
    inp.prop('disabled', true);    }
else {
    inp.prop('disabled', false);
}

还有一个更新,我们可以在一行中编写这个。

$('#state').on('change',function(){
    $('#suburb').prop('disabled', ($('#state').val() == '0'));
});

可以在http://jsfiddle.net/h9vvacfq/8/

找到工作