Question

我在我的一个应用程序asp.net应用程序中使用jquery UI手风琴控件。手风琴的数据来自数据库，每个数据库记录都有ID，标题字段和内容字段。标题是标题，内容是打开平局时显示的数据......

我希望能够像这样打电话给我的页面：

http://www.mywebsite.com/mypage.aspx?ID=123

并让它显示所有数据（就像现在一样），但是然后将手风琴的默认“抽屉”打开到对应于传递到网址上的ID号的部分...大约有50个页面上的部分。

有关如何处理此问题的任何建议？我的问题是针对jquery手风琴的功能，其余的我知道。那么哪里是用唯一ID标记抽屉的最佳位置，然后javascript代码的片段（我假设）我会根据传入的ID使用'open'抽屉？

谢谢！

Answer 1

这是在http://jqueryui.com/download下载自定义JQuery UI构建时只获得“core”和“accordion”的示例文件的略微修改版本。

<!DOCTYPE html>
<html>
    <head>
        <link type="text/css" href="css/smoothness/jquery-ui-1.7.custom.css" rel="stylesheet" />    
        <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
        <script type="text/javascript" src="js/jquery-ui-1.7.custom.min.js"></script>
        <script type="text/javascript">
            $(function(){

                // Accordion
                $("#accordion").accordion({ header: "h3" });

                // can be done somewhere later in the code, after init
                $('#accordion').accordion('activate' , "#a2");              
            });
        </script>

    </head>
    <body>
        <h2 class="demoHeaders">Accordion</h2>
        <div id="accordion">
            <div>
                <h3 id="a1"><a href="#">First</a></h3>
                <div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div>
            </div>
            <div>
                <h3 id="a2"><a href="#">Second</a></h3>
                <div>Phasellus mattis tincidunt nibh.</div>
            </div>
            <div>
                <h3 id="a3"><a href="#">Third</a></h3>
                <div>Nam dui erat, auctor a, dignissim quis.</div>
            </div>
        </div>
    </body>
</html>

selector-argument必须匹配您指定为“header”的元素 - 在本例中，它是H3-Tag，它获得了ID。运行此代码应该打开第二个窗格。另一种方法是，使用“active”选项指定init中的活动窗格：

<script type="text/javascript">
$(function(){    
    $("#accordion").accordion({ header: "h3", active :"#a2"  });
});
</script>

Answer 2

我认为你有这样的HTML（我把ID放在A-Tag中）：

<div id="accordion">
  <div>
    <a id="a1" href="#">First header</a>
    <div>First content</div>
  </div>
  <div>
    <a id="a2" href="#">Second header</a>
    <div>Second content</div>
  </div>
</div>

你就像这样激活手风琴：

$(function() {
    $("#accordion").accordion();
});

Accordion提供了一种激活特定窗格的方法：

激活内容的一部分手风琴以编程方式。该指数可以是匹配的零索引数字标题的位置关闭或与元素匹配的选择器。通过 -1关闭所有（只能使用collapsible：true）。

所以你可以使用：

$("#accordion").accordion("activate", "a#a2");

通过脚本激活它。

Answer 3

您可以使用

$("#accordion").accordion('activate' , 1);

其中0表示第一个抽屉，1表示第二个抽屉，依此类推。

Jquery UI手风琴问题 - 你会怎么做？

3 个答案: