jquery - 如何替换 jQueryUI 按钮文本？

Question

我有一个与 jQueryUI 一起使用的按钮，就像这样(简化的)。

<button id="mybutton">Play<button>
<script>
$("#mybutton").button().toggle(
    function(){
       $(this).text('Stop');
    },
    function(){
       $(this).text('Start');
    },
);
</script>

此代码破坏了按钮的外观，因为将其放入按钮小部件时，按钮内添加了一个新的跨度。所以我现在像这样更改按钮值

$(this).find('span').text('Stop');

这很棘手，因为我不能再将按钮视为黑匣子而必须进入内部。

有没有一种干净的方法可以做到这一点？

Answer 1

也许您现在可以使用 jQuery UI 按钮的 label 选项？

$("#mybutton").button().toggle(function() {
   $(this).button('option', 'label', 'Stop');
}, function() {
   $(this).button('option', 'label', 'Start');
});

jsbin preview here