0

我正在尝试动态填充 JQM 手风琴/可折叠集的内容。我看过http://the-jquerymobile-tutorial.org/jquery-mobile-tutorial-CH20.php,但这些例子似乎已经过时了。所以我试图想出一个可行的例子,但我目前被卡住并且看不到,为什么这不应该工作:

<script type="text/javascript">
$(document).ready(function() {
    $(".mySet").bind('expand', function (event, ui) {
        /* This prints e.g. "This is the first entry\n
        I'm the collapsible set content for section 1." */
        console.log($(this).text());

        /* This should print "This is the first entry" (=the innerText of <h3>)
        but it doesn't, it prints "This is the first entry\n
        I'm the collapsible set content for section 1." as well */
        console.log($(this).next().text());

        /* This should just print "I'm the collapsible set content for section 1"
        (=the innerText of <p>) but it doesn't, it prints e.g. "This is the 
        first entry\n I'm the collapsible set content for section 1." as well */
        console.log($(this).nextAll("p").text());
    });
});
</script>

<div data-role="collapsible-set">
    <div data-role="collapsible" class="mySet">
        <h3>This is the first entry</h3>
        <p>I'm the collapsible set content for section 1.</p>
    </div>
    <div data-role="collapsible" class="mySet">
        <h3>This is the second entry</h3>
        <p>I'm the collapsible set content for section 2.</p>
    </div>
</div>

有谁看到,为什么 jQuery 不会下降$(this)(=which 指向当前扩展的<div ...class="mySet">?如果我在 Opera 的 DragonFly 中调试此代码,我可以看到,这$(this)似乎与$(this).next()(至少它们对 innerHTML 等具有相同的值) .)

谢谢你的帮助!

4

1 回答 1

0

所以,在摆弄了一下之后,我想出了以下黑客/解决方法:

$(document).ready(function() {
    $(".mySet").bind('expand', function (event, ui) {
        /* I'm just creating a new var "myDiv" which points to my current div (so in a 
        way "myDiv" is just a copy of "this" */
        var myDiv = $("#"+$(this).attr('id'));
        var myP = myDiv.find('p:first');

        // Works as expected, prints "I'm the collapsible set content for section 1."
        console.log(myP.text());
    });
});
于 2013-01-19T20:33:34.390 回答