应用错误收集

如何在HTM文件中创建可折叠面板扩展器的等效物？

时间：2012-07-26 13:14:22

标签： javascript asp.net client-side collapsiblepanelextender

我创建了一个带有可折叠面板的asp.net文件。我假设如果我接受客户端的源并将其复制到HTM文件中它仍然可以工作 - 但事实并非如此。

我所做的是“查看源代码”并将其全部复制到空白的HTM文件中。除了可折叠面板之外，所有这些都在工作。

为什么呢？我能解决吗？

由于

2 个答案:

答案 0 :(得分：0)

这是为什么

我会尝试简短解释，但必须使用假设。 ASP.NET是一个在运行时编译的Web应用程序框架，意味着您的页面从对象和控件转换为html，css和javascript; Javascript（ScriptResource.axd）已加密，您无法访问htm页面中的脚本。 Good Link about ScriptResource.axd

如何解决？

好消息是肯定的！假设您正在使用AJAXToolKit（并且这是一个很大的假设），您可以使用jQuery UI Accordion只有一个部分。我测试了两者，它们的工作原理相同。我希望这有帮助！ jQuery Accordion reference

使用AJAX（可折叠面板）的ASPX示例：

<form id="form1" runat="server">
  <div>
    <asp:ScriptManager ID="ScriptManager1" runat="server" />
    <ajaxToolkit:CollapsiblePanelExtender runat="server" 
        TargetControlID="Panel1" 
        Collapsed="true"
        ExpandControlID="LinkButton1" 
        CollapseControlID="LinkButton1" />

    <asp:LinkButton ID="LinkButton1" runat="server">Panel</asp:LinkButton>
    <asp:Panel ID="Panel1" runat="server">
        This is a Test
    </asp:Panel>
  </div>
</form>

使用jQuery（Accordion）的HTM示例：

<head>
<title></title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js"></script>
<script type="text/javascript">

    $(document).ready(function () {
        $('#Panel1').hide();

        $('#pnlLink').click(function () {
            $(this).next().toggle();
            return false;
        }).next().hide();
    });

</script>
</head>
<body>
   <a id="pnlLink" href="#">Panel</a>
   <div id="Panel1">
    <div>
        This is a test</div>
    </div>
</body>

答案 1 :(得分：0)

您可以使用jQueryUI手风琴功能 http://jqueryui.com/accordion/

或jQuery slideToggle（）函数问候内特