Question

我有以下代码，根据下拉列表中的值，禁止或启用文本框。

现在，这就是我从下拉列表中引用此代码的方式：

不幸的是，代码正在生成异常。我相信我使用了错误的事件处理程序，即OnSelectedIndexChanged。我该如何解决这个问题？

Answer 1

使用onchange事件，它将适用于javascript函数调用。 OnSelectedIndexChanged是服务器端事件。

Answer 2

1）将 OnSelectedIndexChanged 替换为 onchange

和

2）替换

var DropDown_Total = document.getElementById（“DropDown_Total”）

与

var DropDown_Total = document.getElementById（“＆lt;％= DropDown_Total.ClientID％＆gt;”）

表示所有getElementById

3）替换（DropDown_Date.options [DropDown_Date.selectedIndex] .value 同下拉列表的（DropDown_Date.options [DropDown_Date.selectedIndex] .text

试试这个工作

<script type="text/javascript">
    function DisableEnable() {
        var DropDown_Total = document.getElementById("<%= DropDown_Total.ClientID %>")
        var Textbox_Total = document.getElementById("<%= Textbox_Total.ClientID %>")
        var DropDown_Date = document.getElementById("<%= DropDown_Date.ClientID %>")
        var Textbox_Date = document.getElementById("<%= Textbox_Date.ClientID %>")

        if (DropDown_Total.options[DropDown_Total.selectedIndex].text == "Any Amount") {

            Textbox_Total.disabled = true;
        }

        else {
            Textbox_Total.disabled = false;
        }

        if (DropDown_Date.options[DropDown_Date.selectedIndex].text == "Any Date") {
            Textbox_Date.disabled = true;
        }

        else {
            Textbox_Date.disabled = false;
        }
    }
</script>

HTML

<asp:TextBox runat="server" ID="Textbox_Total" />
<asp:TextBox runat="server" ID="Textbox_Date" />
<asp:DropDownList ID="DropDown_Total" runat="server" onchange="DisableEnable();">
    <asp:ListItem>Any Amount</asp:ListItem>
    <asp:ListItem>Exact Amount</asp:ListItem>
    <asp:ListItem>Below Amount</asp:ListItem>
    <asp:ListItem>Above Amount</asp:ListItem>
</asp:DropDownList>
<asp:DropDownList ID="DropDown_Date" runat="server" onchange="DisableEnable();">
    <asp:ListItem>Any Date</asp:ListItem>
    <asp:ListItem>Exact Date</asp:ListItem>
    <asp:ListItem>Before</asp:ListItem>
    <asp:ListItem>After</asp:ListItem>
</asp:DropDownList>

Answer 3

只需将OnSelectedIndexChanged替换为onchange，因为onchange由js处理。 OnSelectedIndexChanged由后面的代码处理。

Answer 4

教程：如何在Javascript中使用DropDownList禁用/启用文本框

在这个函数中，我们将dropdownlist id和textbox id作为参数传递给js函数

  <script type="text/javascript">
    function DisableEnableTxtbox(DropDown, txtbox) {

        if (DropDown.options[DropDown.selectedIndex].text == "free") {

            txtbox.disabled = true;
        }

        else {
            txtbox.disabled = false;
        }

    }
  </script>

现在添加以下代码：

 <td align="center" class="line">
        <asp:DropDownList ID="ddl_MonP1" runat="server" CssClass="ppup2"   onchange="DisableEnableTxtbox(this,txt_MonP1);"></asp:DropDownList>
        <asp:TextBox ID="txt_MonP1" runat="server" CssClass="ppup" placeholder="Subject"></asp:TextBox>
       </td>

JavaScript - 更改下拉列表索引时禁用文本框

4 个答案: