在选中的项目上显示文本框

本文关键字：显示 文本 项目 | 更新日期: 2023-09-27 18:04:31

从asp.net开始…我想显示我的文本框时，我的复选框被选中，但这似乎不工作。我也尝试了可见属性，但这也不起作用。我到底做错了什么?

代码:

    protected void checked_CheckedChanged(object sender, EventArgs e)
    {
        text.Style["display"] = "block";
    }
布局:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <p>gehuwd/samenwonend<asp:checkbox runat="server" ID="checked" OnCheckedChanged="checked_CheckedChanged"></asp:checkbox>
        </p>
        <asp:TextBox runat="server" ID="text" style="display:none"></asp:TextBox>
    </form>
</body>
</html>

在选中的项目上显示文本框

使用AutoPostBack属性作为复选框，并将其设置为true:

<asp:checkbox runat="server" ID="checked" OnCheckedChanged="checked_CheckedChanged" AutoPostBack="true"></asp:checkbox>

您可以使用添加css属性的文本框在c#如下所示。如果你的复选框OnCheckedChanged不工作，那么你可以在复选框中设置属性AutoPostBack为真。

protected void checked_CheckedChanged(object sender, EventArgs e)
{
    text.Attributes.Add("display","block");
}

您也可以使用jQuery或javascript完全在客户端完成此操作。每次需要更改HTML的视觉外观时，都会向服务器发送一个帖子，这会给服务器带来不必要的压力，并且会减慢站点的整体性能，从而对用户体验产生负面影响。

<head runat="server">
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.3/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            var id = "<%: text.ClientID %>";
            id = "#" + id;
            $(id).hide();
            $("#chkShowHide").change(function () {
                if (this.checked) {
                    $(id).show();
                }
                else{
                    $(id).hide();
                }
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <input id="chkShowHide" type="checkbox" />&nbsp;Show'Hide<br />
        <asp:TextBox runat="server" ID="text"></asp:TextBox>
    </form>
</body>
相关文章：