Question

我尝试根据第一个select2选项的值将readonly属性设置为第二个select2。

我的脚本如下：

<select name="Name" id="Name" style='width:45%'>
  <option value="1">disable</option>
   <option value="2">enable</option>
</select>
<select name="Name2" id="Name2" style='width:45%'>
  <option value="d">David</option>
   <option value="b">Bob</option>
</select>

我的JS脚本设置如下：

$(document).ready(function(){
    $('#Name,#Name2').select2();
  $('#Name').change(function(){
    var val = $(this).val();
    if(val==1)
    {
        $('#Name2').attr('readonly','readonly');
    }else
    {
        $('#Name2').removeAttr('readonly');
    }
  })
})

但是，上面的脚本不适用于select2选项，但对于textbox很好。（Fiddlejs）

我尝试搜索某些来源here，但这没有帮助。

感谢。

Answer 1

使用.prop()根据值

$(document).ready(function() {
  
  $('#Name').change(function() {
    var val = $(this).val();
    $('#Name2').prop('disabled', val == 1);//prop disabled

  }).change();
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="Name" id="Name" style='width:45%'>
  <option value="1">disable</option>
   <option value="2">enable</option>
</select>
<select name="Name2" id="Name2" style='width:45%'>
  <option value="d">David</option>
   <option value="b">Bob</option>
</select>

Answer 2

使用像这样的jQuery .prop()方法 $('#Name2').prop("disabled", true)表示禁用和
$('#Name2').prop("disabled", false)用于启用select2。

以下是(Fiddlejs)

如何将readonly切换到select2

2 个答案: