Question

我正在做网站，员工可以写他的简历，我有一段过去的工作，我想显示员工可以写这个信息的领域（公司，职位等），但是，我想要只显示其中一个部分，如果员工想要添加更多旧工作，他将点击添加更多工作，然后显示2或3个以上工作的字段，目前我有3个这样的部分声明如下：

    <asp:Label ID="Label6" runat="server" Text="Empresa" Style="z-index: 1; left: 10px;
        top: 165px; position: absolute"></asp:Label>
    <asp:TextBox ID="TextBox3" runat="server" Style="z-index: 1; left: 80px; top:  165px;
        position: absolute" Width="200px"></asp:TextBox>
    <asp:Label ID="Label7" runat="server" Text="Fecha" Style="z-index: 1; left: 10px;
        top: 195px; position: absolute"></asp:Label>
    <asp:DropDownList ID="DropDownList1" runat="server" Style="z-index: 1; left: 80px;
        top: 195px; position: absolute">
        <asp:ListItem>Enero</asp:ListItem>
        <asp:ListItem>Febrero</asp:ListItem>
        <asp:ListItem>Marzo</asp:ListItem>
        <asp:ListItem>Abril</asp:ListItem>
        <asp:ListItem>Mayo</asp:ListItem>
        <asp:ListItem>Junio</asp:ListItem>
        <asp:ListItem>Julio</asp:ListItem>
        <asp:ListItem>Agosto</asp:ListItem>
        <asp:ListItem>Septiembre</asp:ListItem>
        <asp:ListItem>Octubre</asp:ListItem>
        <asp:ListItem>Noviembre</asp:ListItem>
        <asp:ListItem>Diciembre</asp:ListItem>
    </asp:DropDownList>
    <asp:DropDownList ID="DropDownList2" runat="server" Style="z-index: 1; left: 172px;
        top: 195px; position: absolute" OnSelectedIndexChanged="DropDownList2_SelectedIndexChanged">
    </asp:DropDownList>
    <asp:Label ID="Label8" runat="server" Text="a" Style="z-index: 1; left: 235px; top: 195px;
        position: absolute"></asp:Label>
    <asp:DropDownList ID="DropDownList3" runat="server" Style="z-index: 1; left: 250px;
        top: 195px; position: absolute">
        <asp:ListItem>Enero</asp:ListItem>
        <asp:ListItem>Febrero</asp:ListItem>
        <asp:ListItem>Marzo</asp:ListItem>
        <asp:ListItem>Abril</asp:ListItem>
        <asp:ListItem>Mayo</asp:ListItem>
        <asp:ListItem>Junio</asp:ListItem>
        <asp:ListItem>Julio</asp:ListItem>
        <asp:ListItem>Agosto</asp:ListItem>
        <asp:ListItem>Septiembre</asp:ListItem>
        <asp:ListItem>Octubre</asp:ListItem>
        <asp:ListItem>Noviembre</asp:ListItem>
        <asp:ListItem>Diciembre</asp:ListItem>
    </asp:DropDownList>
    <asp:DropDownList ID="DropDownList4" runat="server" Style="z-index: 1; left: 342px;
        top: 195px; position: absolute" OnSelectedIndexChanged="DropDownList4_SelectedIndexChanged">
    </asp:DropDownList>
    <asp:Label ID="Label9" runat="server" Text="Puesto:" Style="z-index: 1; left: 10px;
        top: 225px; position: absolute"></asp:Label>
    <asp:TextBox ID="TextBox4" runat="server" Style="z-index: 1; left: 80px; top: 225px;
        position: absolute" Width="200px"></asp:TextBox>
    <asp:Label ID="Label10" runat="server" Text="Funciones:" Style="z-index: 1; left: 10px;
        top: 255px; position: absolute"></asp:Label>
    <asp:TextBox ID="TextBox5" runat="server" Rows="5" TextMode="MultiLine" Style="z-index: 1;
        left: 80px; top: 255px; position: absolute" Width="200"></asp:TextBox>

所以，我只是想隐藏另外2个，当我点击按钮添加更多时，只显示它们，我是ASP的新手，不知道怎么做，以及这如何影响其他我拥有的标签和文本框，因为每个人都有左侧和顶部的位置，如果需要移动或者需要移动它们。

我希望我能解释我的问题，你可以帮助我：D

Answer 1

protected void btnShowMore_Click(object sender, EventArgs e)
{
DropDownList1.Visible=false;
DropDownList2.Visible=false;
DropDownList3.Visible=true;
}

如果您希望显示控件但用户无法对其执行操作，则可以使用“已启用”属性。

Answer 2

这听起来像你需要一些javascript魔法。在aspx页面中单击按钮时，您可以执行类似的操作。只需要将要切换的部分默认情况下显示属性为“none”（style =“display：none”）。然后，当单击“添加更多”时，显示属性将更改为“阻止”，显示隐藏的部分：

<script type="text/javascript">
    function toggle_visibility(id) {
        var e = document.getElementById(id);
        if(e.style.display == 'block')
        {
            e.style.display = 'none';
        }
        else
        {
            e.style.display = 'block';
         }
    }
</script>

然后调用此javascript函数，只需按钮或链接：

<a href="javascript:toggle_visibility('#idOfDiv');">Add More</a>

祝你好运！

使用ASP上的按钮显示更多字段

2 个答案: