Question

我在我的页面上创建了一个手风琴，我希望能够在每个已展开的窗格中都有一些超链接文本。

单击“缩小文字”链接时，需要折叠手风琴。

如何通过编辑我使用过的现有代码来完成这项工作？

jQuery的：

$(function() {
    $( "#accordion" ).accordion({
        active: false,
        collapsible: true,
        heightStyle: "content",
        navigation: true,
        header: ".menuitem"
     });

    var hash = window.location.hash;
    var anchor = $('a[href$="'+hash+'"]');
    if (anchor.length > 0){
        anchor.click();
    }
});

HTML：

<div id="accordion">
<h3 class="menuitem">Item 1</h3>
<div>
<p>Blah blah blah</p>
<a href="#">Reduce text</a>
</div>

<h3 class="menuitem">Item 1</h3>
<div>
<p>Blah blah blah</p>
<a href="#">Reduce text</a>
</div>

<div id="accordion">
<div>
<h3 class="menuitem">Item 1</h3>
<p>Blah blah blah</p>
<a href="#">Reduce text</a>
</div></div>

JS小提琴：http://jsfiddle.net/EA22W/

希望我已经解释得很好，这个问题很有意义。

由于

Answer 1

我在anchor元素上添加了一个on click事件，用于关闭相应的accordion项：

$(function() {
$( "#accordion" ).accordion({
    active: false,
    collapsible: true,
    heightStyle: "content",
    navigation: true,
    header: ".menuitem"
 });

var hash = window.location.hash;
var anchor = $('a[href$="'+hash+'"]');
if (anchor.length > 0){
    anchor.click();
}

//$("#accordion").on('click', '.ui-accordion-content a', function(){
$("#accordion").on('click', '.ui-accordion-content .reduce', function(){ //edit
    $(this).parent().slideToggle();
});
});

Answer 2

以下是可以帮助您的代码。

<强>代码

function accordianReduce(){
    $( "#accordion" ).accordion({
        active: false,
        collapsible: true,
        heightStyle: "content",
        navigation: true,
        header: ".menuitem"
     });  
}
accordianReduce()
$('.reduce').on('click', function(){
    accordianReduce() 
})

Fiddle Demo

jQuery Accordion在窗格内的点击链接上崩溃

2 个答案: