使用jquery在asp.net中使用选项卡制作手风琴

时间:2013-11-15 12:15:02

标签: javascript jquery html asp.net css

我在visual studio中使用jquery制作手风琴标签,此时窗格不会展开或折叠。我收到了这个错误 未捕获的TypeError:对象[object Object]没有方法'tabs' 这是我的HTML

<section id="Popularquestions">
            <h4>Popular Questions</h4>
        <h5 class="current">1.What are the most common camera ports?</h5>
        <div class="pane"><p><a href="Knowledgebase/commonports.aspx">Here</a> is a table of the most common camera ports available</p></div>
        <h5>2.Where can I see a list of vendors and their MAC addresses?</h5>
        <div class="pane"><p></p></div>
        <h5>3.Where can I see a list of makes and models?</h5>
        <div class="pane"><p></p></div>
        <h5>4.Where can I see a list of usernames and passwords?</h5>
        <div class="pane"><p></p></div>
        <h5>5.Where can I see a list of available apps?</h5>
        <div class="pane"><p></p></div>

jquery的

<script src="assets/jquery.js"></script>
    <script>
        $("#accordion").tabs(
    "#accordion div.pane",
    { tabs: 'h2', effect: 'slide', initialIndex: null }
  );
    </script>

和css

#accordion {
    background:#333 url(/media/img/gradient/h300.png) 0 0;
    width: 300px;
    border:1px solid #333;
    -background:#666;
    margin: 0 auto;
}

/* accordion header */
#accordion h2 {
    background:#ccc url(/media/img/gradient/h30.png);
    line-height: 14px;
    margin:0;
    padding:5px 15px;
    font-size:14px;
    font-weight:normal;
    border:1px solid #fff;
    border-bottom:1px solid #ddd;
    cursor:pointer;
}

/* currently active header */
#accordion h2.current {
    cursor:default;
    background-color:#fff;
}

/* accordion pane */
#accordion .pane {
    border:1px solid #fff;
    border-width:0 2px;
    display:none;
    height:180px;
    padding:15px;
    color:#fff;
    font-size:12px;
}

/* a title inside pane */
#accordion .pane h3 {
    font-weight:normal;
    margin:0;
    font-size:16px;
    color:#999;
}

1 个答案:

答案 0 :(得分:1)

尝试这样:

 <script>
$(function() {

 $("#accordion").tabs(
    "#accordion div.pane",
    { tabs: 'h2', effect: 'slide', initialIndex: null }

});
</script>