jQuery UI按钮 - 如何更改样式和图标选中按钮？

Question

<script type="text/javascript"> 
    jQuery(document).ready(function($){ 
     $('.date').datepicker($.datepicker.regional['cs']); 
     $(".votePollState").button({ icons: {primary:'ui-icon-closethick'},text: false }); 
    }); 
</script> 

HTML代码：

<input type="checkbox" class="votePollState" id="point-1"/><label for="point-1">Choice 1</label> 

<input type="checkbox" class="votePollState" id="point-1"/><label for="point-1">Choice 1</label> 

我需要设置一些图标复选框的状态下，没有选中的复选框有其他的图标，选中的复选框有其他的。不，如果我检查复选框，这有一些图标，但只改变边框颜色。

在iPhone上使用ON/OF开关按钮。

THX

Answer 1

你可以添加一个.change()处理程序，把复选框的.checked状态，并且基于其上的图标，就像这样：

$(".votePollState").button({ 
    icons: {primary:'ui-icon-closethick'}, 
    text: false 
}).change(function() { 
    $(this).button("option", { 
     icons: { primary: this.checked ? 'ui-icon-check' : 'ui-icon-closethick' } 
    }); 
}); 

You can test it out here。