初始化之前无法调用方法; 试图调用方法'刷新'

Question

我想通过单击菜单项来更新链接按钮的值.

HTML:

<div id="menu">
    <ul data-role="listview" data-icon="false">
        <li><a href="#">Value A</a></li>
        <li><a href="#">Value B</a></li>
    </ul>
</div>

<a href="#" id="selected" data-role="button"></a>

jQueryMobile:

$('#selected').hide();

$("#menu li a").on('click',function(){
    $('#selected').html($(this).html()).slideDown().button("refresh");
});

文本更新工作正常,但按钮css未正确更新.

我收到以下错误:

未捕获错误:在初始化之前无法调用按钮上的方法; 试图调用方法'刷新'

我们在谈论哪种初始化？页面和按钮已经初​​始化,不是吗？

---

编辑:

我也试过这个:

$(document).on("mobileinit", function() {

    $('#selected').hide();

    $("#menu li a").on('click',function(){
        $('#selected').html($(this).html()).slideDown().button("refresh");
    });

});

没有错误信息; 但没有文字更新:(

Answer 1

该问题有时是由jquery-ui和bootstrap-button插件冲突引起的.jquery-ui代码应该在bootstrap.js之前运行,这解决了问题.

Answer 2

工作示例

这是一个工作示例： http: //jsfiddle.net/Gajotres/BDmex/

HTML：

<div id="menu">
    <ul data-role="listview" data-icon="false">
        <li><a href="#">Value A</a></li>
        <li><a href="#">Value B</a></li>
    </ul>
</div>

<a href="#" id="selected" data-role="button"></a>

JS：

$('#selected').hide();

$("#menu li a").on('click',function(){
    $('#selected').html('<span class="ui-btn-inner"><span class="ui-btn-text">' + $(this).html() + '</span></span>').slideDown();
});

• 您在按钮标签内缺少 data-role="button"
• 因为按钮最初创建时没有文本，所以您需要添加具有 2 个跨度的适当内部结构

第二种解决方案

这个问题还有另一种解决方案，可以在这篇文章+描述和工作示​​例中找到。