Wie kann das jQueryUI-Symbol einer Schaltfläche nach der Initialisierung dynamisch geändert werden?

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> 

Bei Klick auf die Schaltfläche #swap, möchte ich auf das Symbol (jQueryUI icon) mit #dynabutton von ui-icon-gear zu ui-icon-locked assoziiert wechseln.

Aber ich weiß nicht, ob das unterstützt wird?

Answer 1

Sie können .button("option", options) rufen Sie später Optionen festlegen (wie andere Widgets jQuery UI), die Symbole einschließlich:

$(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.