Làm thế nào để tự động thay đổi biểu tượng jQueryUI của một nút sau khi khởi tạo?

Question

<script> 
    $(function() 
    { 
     $("#dynabutton").button(
     { 
      icons: 
      { 
       primary: "ui-icon-gear" 
      }, 
      text: false 
     }); 

     $("#swap").button(
     { 
      icons: 
      { 
       primary: "ui-icon-locked" 
      }, 
      text: true 
     }).click(function(event) 
     { 
      // change #dynabutton icon from 
      // "ui-icon-gear" 
      // to: 
      // "ui-icon-locked" 
     });   
    }); 
    </script> 



<div class="demo"> 

<button id="dynamic_button">Button with gear icon</button> 
<button id="swap">Swap icons</button> 

</div> 

On click vào nút #swap, tôi muốn chuyển sang biểu tượng (jQueryUI icon) đi kèm với #dynabutton từ ui-icon-gear để ui-icon-locked.

Nhưng tôi không biết liệu điều này có được hỗ trợ không?

Answer 1

Bạn có thể gọi .button("option", options) để đặt tùy chọn sau (như widget jQuery UI khác), bao gồm các biểu tượng:

$(function() { 
    $("#dynabutton").button({ 
     icons: { primary: "ui-icon-gear" }, 
     text: false 
    }); 
    $("#swap").button({ 
     icons: { primary: "ui-icon-locked" }, 
     text: true 
    }).click(function() { 
     $("#dynabutton").button("option", { 
      icons: { primary: "ui-icon-locked" } 
     }); 
    });   
}); 

You can test it here.