How to change a specific JQuery Mobile button icon with javascript

问题

I have previoulsy asked a similar question of howto change a button icon, which was answered here How to change a JQuery Mobile button icon with javascript

While this indeed helped me change the icons, it changed the icons of ALL the buttons in my project. What I'm asking for now is how to isolate the icon changes to a single button

As example, if I have two buttons on my page;

  <a href="#language1" id="language4" 
    data-rel="popup" data-role="button" 
    data-icon="edit" data-inline="true" 
    data-position-to="origin" >Russian</a>

and

    <a href="#language2" id="language3" 
    data-rel="popup" data-role="button" 
    data-icon="edit" data-inline="true" 
    data-position-to="origin" >English</a>

Then apply the following suggested javascript;

    $('#index').live('pagebeforeshow',function(e,data){    
$('a').buttonMarkup({ icon: "star" });  
    });

Both buttons are affected. If instead I try to reference language3 instead of 'a', then nothing happens. I guess I am missing some fundamental understanding as to how this works

See example Fiddle at http://jsfiddle.net/rdAnY/1/ The Javascript sets the icons of the two language buttons as well as the 'Next' button to a star. How would you set (for example) only the English button to a star, while leaving the Russian button as the original

data-icon="edit"

Thanks

回答1:

The fundamental thing is jquery selectors.

This will change the icon only language2:

$('a[href=#language2]').buttonMarkup({ icon: "star" });

来源：https://stackoverflow.com/questions/14410847/how-to-change-a-specific-jquery-mobile-button-icon-with-javascript

标签

javascript

jquery-mobile