2010-12-15 80 views
8
<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> 

Le clic du bouton #swap, je veux changer l'icône (jQueryUI icon) associée à #dynabutton de ui-icon-gear à ui-icon-locked.Comment modifier dynamiquement l'icône jQueryUI d'un bouton après l'initialisation?

Mais je ne sais pas si cela est pris en charge?

Répondre

22

Vous pouvez appeler .button("option", options) pour définir des options plus tard (comme d'autres widgets jQuery UI), y compris les icônes:

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

+0

Très bon usage de jsfiddle! Je vais devoir essayer ça. –