javascript - jQuery - 错误的技术或错误

Question

我有一个 HTML 页面，我想在其中根据 jQuery Accordion 的选定元素更改 H3 标签的文本。 link 提供了一个小演示.

<div id="acc1" class="basic">
    <h3><a href="#">aaa</a></h3>
    <div></div>
    <h3><a href="#">bbb</a></h3>
    <div></div>
    <h3><a href="#">ccc</a></h3>
    <div></div>
</div>
<h3 class="ui-widget-header">xyz</h3>

$(document).ready(function () {
    $("#acc1").accordion({
        heightStyle: "fill",
        active: false,
        autoheight: false,
        collapsible: true,
        alwaysOpen: false,
        activate: function (event, ui) {
            var idx = $("#acc1").accordion("option", "active");
            var txt = $("#acc1 > h3:nth-child(" + (idx + 1) + ") > a").text();
            $("h3.ui-widget-header").text((idx + 1) + " ---> " + txt);
        }
    });
});

acc1 开始折叠，很快一个元素被点击，jQuery 函数读取它的文本并将它分配给 H3 标签。但是在页面加载后，只需第一次点击，就可以正常工作。之后只会分配错误的值。

我这样做的方法是错误的还是 jQuery 有问题？

用过的东西:jQuery v1.9.0，jQuery UI v1.9.2

问候，草图

Answer 1

这是我的解决方案:

$(document).ready(function () {
    $("#acc1").accordion({
        heightStyle: "fill",
        active: false,
        autoheight: false,
        collapsible: true,
        alwaysOpen: false,
        activate: function (event, ui) {            
        }
    });

    $("h3").click(function(){    
        var txt = $(this).find('a').text(); 
        $(".ui-widget-header").html(txt);  
    });
});

JSFIDDLE DEMO