Javascript 基于下拉列表启用文本框选择“不工作”

Javascript 基于下拉列表启用文本框选择“不工作”,javascript,html,Javascript,Html,基于下拉列表启用文本框选择“不工作” 不管从下拉列表中选择了什么,我的文本框仍然被禁用 有人能帮我解决这个问题吗。代码说明如下 它不起作用的原因是您已经为标签和选择设置了id=category。您的id必须是唯一的!从标签上删除id,所有操作都会正常进行。看看这个例子。干杯 使用.prop'disabled',false代替.removeAttr'disabled'。然后检查 <div class ="container"> <s

基于下拉列表启用文本框选择“不工作”

不管从下拉列表中选择了什么,我的文本框仍然被禁用 有人能帮我解决这个问题吗。代码说明如下


它不起作用的原因是您已经为标签和选择设置了id=category。您的id必须是唯一的!从标签上删除id,所有操作都会正常进行。看看这个例子。干杯

使用.prop'disabled',false代替.removeAttr'disabled'。然后检查
          <div class ="container">
              <script>
                function changeTextBox()
                {
                         var val=$('#category').val();
                      if(val==='option1' || val==='option2'|| val==='option3' || val==='option4')
                      {
                         $('#subcategory').removeAttr("disabled");              
                      }
                      else{$('#subcategory').prop('disabled', true);}
                }
            </script>

        <form class="form-horizontal" role="form">
        <div    class="form-group">

            <label for="category" class="col-sm-2 control-label" id ="category">Category</label>
                <div class="col-sm-3">
                    <select class="form-control" id="category" name="category" onChange="changeTextBox();">
                        <option value="select">--select--</option>
                        <option value="Option1">Option1</option>
                        <option value="Option2">Option2</option>
                        <option value="Option3">Option3</option>
                        <option value="Option4">Option4</option>
                    </select>                   
                </div>
        </div>
        <div class="form-group">
            <label for="sub" class="col-sm-2 control-label">Sub Category Type</label>
                <div class="col-sm-3">
                    <input type="text" class="form-control" id="subcategory" disabled/>                 
                </div>
        </div>
        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-1">
                <button type="submit" class="btn btn-default">Add</button>
            </div>
            <div class="col-sm-1">
                <button type="submit" class="btn btn-default">Edit</button>
            </div>
            <div class="col-sm-1">
                <button type="submit" class="btn btn-default">Delete</button>
            </div>
        </div>
    </form>
    </div>