0

私は従業員が履歴書を書くことができるウェブサイトをやっていて、過去の仕事のセクションがあり、従業員がこの情報（会社、役職など）を書くことができるフィールドを表示したいのですが、これらのセクションの 1 つ。従業員が古い仕事を追加したい場合は、[さらに追加] をクリックして、過去の仕事の 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

4

2 に答える 2

0

これには、JavaScript マジックが必要なようです。ボタンが aspx ページ内でクリックされたときに、このようなことを実行できます。切り替えたいセクションにデフォルトで「なし」の表示属性を持たせる必要があるだけです（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>

頑張ってください！

于 2012-07-02T22:19:22.173 に答える