如何使用jQueryMobile刷新标题中的按钮？

Question

如何使用jQueryMobile刷新标题中的按钮？

我一直在努力寻找一种方法来更改标题中的按钮而不会丢失格式.我想将带有删除图标的删除按钮更改为带有复选图标的完成按钮.

这是代码的缩短版本:

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" />
    <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>
    <script type="text/javascript">
    function swapButton() {
      $('#button').attr('data-icon', 'check').text('Done').trigger('create');
      $('#header').trigger('create');
    }
    </script>
  </head>
  <body>
    <div data-role="page">
      <div data-role="header" data-position="fixed" id="header">
        <a data-icon="delete" id="button" onclick="swapButton()">Delete</a>
        <h1>Test Page</h1>
      </div>
      <div data-role="content">
        <p>Click on Delete to get Done button</p>
      </div>
    </div>
  </body>
</html>

Run Code Online (Sandbox Code Playgroud)

这会正确更改按钮的文本,但所有格式都会消失.

我已经尝试使用trigger('create')按钮和标题不起作用,我也尝试过.page()我在其他地方读到的方法,我也试过了.button().

我想不出别的想法.

Answer 1

Phi*_*ord 5

这样的事情有用吗:

http://jsfiddle.net/u8fnJ/1/

JS

function swapButton() {
    var b = $('#button');
    b.text('Done');
    b.buttonMarkup({ icon: "check" });
    b.button('refresh');
}

Run Code Online (Sandbox Code Playgroud)

jQM文档:

归档时间：	13 年，8 月前
查看次数：	7395 次
最近记录：	13 年，6 月前