Question

在repeater中调用jquery函数。问题我想在点击链接按钮时切换div。我认为不首先jquery函数使用这种情况。我也想到了div和link按钮之间的表格。

function toggleMe() {
        $(function () {
            $('.toggler').on('click', function (ev) {
                $(this).next('.dataContentSection').toggle();
            });
        });
        }

<div id="repeater"><div class="dataContentSection">
    <div>Name</div>
</div>

        <table>
            <tr>
                <td>
                  <asp:LinkButton  class="titleText toggler" OnClientClick="javascript:toggleMe(); return false;"  runat="server">+ Address details</asp:LinkButton>

                    <asp:Label ID="Label1" runat="server" Text="Welcome"></asp:Label>

                </td>
            </tr>
        </table>
<div class="dataContentSection" style="display: none;">
    <div>Address Line 1:</div>
    <div>Address Line 2:</div>
    <div>Address Line 3:</div>
</div>
<div class="dataContentSection">
    <div>Name</div>
</div>
        <table>
            <tr>
                <td>
                  <asp:LinkButton  class="titleText toggler" OnClientClick="javascript:toggleMe(); return false;"  runat="server">+ Address details</asp:LinkButton>

                    <asp:Label ID="Label2" runat="server" Text="Welcome"></asp:Label>

                </td>
            </tr>
        </table>
<div class="dataContentSection" style="display: none;">
    <div>Address Line 1:</div>
    <div>Address Line 2:</div>
    <div>Address Line 3:</div>
</div>
<div class="dataContentSection">
    <div>Name</div>
</div>
        <table>
            <tr>
                <td>
                  <asp:LinkButton  class="titleText toggler" OnClientClick="javascript:toggleMe(); return false;"  runat="server">+ Address details</asp:LinkButton>

                    <asp:Label ID="Label3" runat="server" Text="Welcome"></asp:Label>

                </td>
            </tr>
        </table>
<div class="dataContentSection" style="display: none;">
    <div>Address Line 1:</div>
    <div>Address Line 2:</div>
    <div>Address Line 3:</div>
</div>
<div class="dataContentSection">
    <div>Name</div>
</div>
        <table>
            <tr>
                <td>
                  <asp:LinkButton  class="titleText toggler" OnClientClick="javascript:toggleMe(); return false;"  runat="server">+ Address details</asp:LinkButton>

                    <asp:Label ID="Label4" runat="server" Text="Welcome"></asp:Label>

                </td>
            </tr>
        </table>
<div class="dataContentSection" style="display: none;">
    <div>Address Line 1:</div>
    <div>Address Line 2:</div>
    <div>Address Line 3:</div>
</div>
<div class="dataContentSection">
    <div>Name</div>
</div>
        <table>
            <tr>
                <td>
                  <asp:LinkButton  class="titleText toggler" OnClientClick="javascript:toggleMe(); return false;"  runat="server">+ Address details</asp:LinkButton>

                    <asp:Label ID="Label5" runat="server" Text="Welcome"></asp:Label>

                </td>
            </tr>
        </table>
<div class="dataContentSection" style="display: none;">
    <div>Address Line 1:</div>
    <div>Address Line 2:</div>
    <div>Address Line 3:</div>
</div>
</div>

Answer 1

问题是toggleMe()功能。如果你想要切换div，你需要做这样的事情： -

  $(function () {
        $('.toggler').click(function (ev) {
            $(".dataContentSection").toggle();
            $(this).next('.dataContentSection').toggle();
        });
    });

希望这有帮助。

在转发器中调用JQuery函数

1 个答案: