使用javascript启用/禁用用户控制

Enable/Disable user control using javascript

本文关键字:用户 控制 javascript 启用 使用      更新时间:2023-09-26

我有一个usercontrol应该禁用/启用基于下拉选择。请查看下面的代码。

  if (name== 'A') {
        $("#uc_panel").prop("disabled", "disabled");
        $("#uc_btnAddCategory").prop("disabled", "disabled");
        $("#uc_ddlCategorySelection").prop("disabled", "disabled");}
  else
  {
    $("#uc_panel").prop("disabled", "");
    $("#uc_btnAddCategory").prop("disabled", "");
    $("#uc_ddlCategorySelection").prop("disabled", "");
  }

第一次从下拉菜单中选择'A'时,usercontrol被禁用。第二次我选择'B'并点击BtnAdd,用户控件被禁用了,但它应该是启用的

如果您使用prop函数,当道具为'disabled', 'checked'等时使用布尔值。您可以查看文档。您使用prop的方式与旧版本的jquery中使用的attr函数相同

if (name == 'A') {
    $("#uc_panel").prop("disabled", true);
    $("#uc_btnAddCategory").prop("disabled", true);
    $("#uc_ddlCategorySelection").prop("disabled", true);
} else {
    $("#uc_panel").prop("disabled", false);
    $("#uc_btnAddCategory").prop("disabled", false);
    $("#uc_ddlCategorySelection").prop("disabled", false);
}

所以你可以像这样缩短它:

var isA = name == 'A';
$("#uc_panel").prop("disabled", isA);
$("#uc_btnAddCategory").prop("disabled", isA);
$("#uc_ddlCategorySelection").prop("disabled", isA);

或:

$("#uc_panel, #uc_btnAddCategory, #uc_ddlCategorySelection").prop("disabled", name == 'A')

This Help You.

HTML

<select id="mySelect" onchange="checkField(this.value)">
  <option>Apple</option>
  <option>Banana</option>
  <option>Orange</option>
</select>
<input type="text" id="txt" value="Hello">
Javascript

<script>
   function checkField(val)
    {          
      var button = document.getElementById("txt");
      button.disabled = true;
    }
</script>

下拉菜单会禁用

文本框

此外,为了响应所选索引的变化,在下拉列表中添加了这个onchange事件:"