jquery-mobile - Change icon of button jQuery Mobile

Question

I'm trying to change an icon of a button to another, but is not working.

I have:

<a id="login" href="login.html" data-role="button" data-icon="user" data-iconpos="top">Login</a>

And I did:

$('#login').data('icon', 'user_highlight');
$('#login').button("refresh");

But it did not work. How can I solve?

Answer 1

看到这个答案。基本上你使用buttonMarkup。

 $('#login').buttonMarkup({ icon: "star" });

见工作示例小提琴

Answer 2

该buttonMarkup方法对我不起作用，但手动方法确实有效：

$('#login').removeClass('ui-icon-foo').addClass('ui-icon-bar').trigger('refresh');

Answer 3

尝试放置代码以更改图标pageshow event

    $('#page2').bind('pageshow', function () {
        $('#login').data('icon', 'user_highlight');
        try {
            $('#login').button("refresh");
        } catch (e) {
            $('#login').button();
        }
    });