0

我需要在脚本中进行一些修改，但由于我对 jquery 不太友好，所以无法这样做

当页面回发时，我想保持面板的状态。现在，如果我刷新页面，所有面板都已折叠，

我正在使用下面的代码

$(document).ready(function() {
    $(“DIV.ContainerPanel > DIV.collapsePanelHeader > DIV.ArrowExpand”).toggle(function() {
        $(this).parent().next(“div.Content”).show(“slow”);
        $(this).attr(“class”, “ArrowClose”);
    },function() {
        $(this).parent().next(“div.Content”).hide(“slow”);
        $(this).attr(“class”, “ArrowExpand”);
    });
});

请帮忙

4

3 回答 3

0

该答案将完全符合您的要求，我不知道您在创建什么，或者回发的原因-但您可能会发现最好的方法是消除回发并处理它 ajax jQuery ，这将阻止所有解决您遇到的问题并创建更快、更友好的用户体验。

我不知道你在做什么或者你可能有什么安全问题，但如果可以的话，看看 ajax ，那是一大堆代码，只是为了记住页面状态

于 2012-09-01T18:28:27.203 回答
0

您要求的是记住当前打开的面板。

由于此面板不是本机 asp.net 控件，因此 asp.net 不会在回发时记住该值。

一种解决方案是在容器中保留一个隐藏的输入控件，并在该输入中维护当前打开的 div 的值。

然后，即使在回发时，Asp.net 也会接收并发送回这些数据。

在准备好文档后，您可以通过读取此值重新打开打开的面板。

编辑：添加了一些代码

从您的选择器中，我假设您的 html 看起来像这样。

<div class="ContainerPanel">
    <div class="collapsePanelHeader">
        <div class="ArrowExpand"">

        </div>
    </div>
    <div id="content1" class="Content"">

    </div>
    <div class="collapsePanelHeader">
        <div class="ArrowExpand"">

        </div>
    </div>
    <div id="content2" class="Content"">

    </div>
    <input id="selectPanel1" runat="server" class="selectPanel"/>
</div>

我为每个内容块添加了一个 ID。如果您没有 ID，则必须添加它们才能使此代码正常工作。

请注意 ContainerPanel 底部的输入标记。这将需要记住哪个 div 是打开的。asp.net 要求每个元素都有唯一的 id 标签。

<input id="selectPanel1" runat="server" class="selectPanel"/>

js会是这样的：

$(document).ready(function() {
    $("div.ContainerPanel > div.collapsePanelHeader > div.ArrowExpand").toggle(function() {
        $(this).parent().next("div.Content").show("slow");
        $(this).attr("class", "ArrowClose");
        //Put the id of the selected content into an input
        //This is so that it goes to the server
        var inputBox = $(this).parent().parent().find(".selectPanel");
        inputBox.val("#" + $(this).parent().next("div.Content").attr("id"));
    },function() {
        $(this).parent().next("div.Content").hide("slow");
        $(this).attr("class", "ArrowExpand");
    });
    //This supports multiple ContainerPanel divs.
    $("div.ContainerPanel").each(function(e){
        //retrive value of div open before postback and show it
        var selectedContentId = $(this).find(".selectPanel").val();
            if(selectedContentId != "")
            $(selectedContentId).show();
    }); 
});
于 2012-09-01T16:54:27.197 回答
0

在过去的两天里，我用自己的代码处理了这个挑战。我需要能够从 jQuery 或 Code behind 甚至从展开/折叠图标展开或折叠九个不同的面板，并将回发保持在最低限度。我还需要在输入时捕获每个文本框、ddl、复选框值。

我的解决方案是一个与 jQuery 交互并在会话中管理结构的 Web 服务。然后，后面的代码和 jQuery 代码可以与 Web 服务共享数据。

我在结构中保留的一组值是一个标志，它告诉我面板是展开还是折叠。

尽管这对您的问题来说可能是多余的，但该解决方案的灵活性非常强大。通过将大块数据定义为单个类结构，我可以在 1-3 行代码中读取和更新任何内容。

于 2012-10-20T03:31:40.170 回答