jQuery-UI按钮设置初始图标 [英] jQuery-UI Button Set Initial Icon

问题描述

我有以下jQuery脚本将一个复选框转换为jQuery-UI按钮，并设置要显示的图标。单击此按钮也会更改图标。一切工作正常。然而，我似乎无法打开正确的语法设置初始图标基于复选框的初始选中状态。

I have the following jQuery script to transform a checkbox into a jQuery-UI button and set up the icons to be displayed. It also changes the icon when the button is clicked. It all works fine. However I cannot seem to hit on the correct syntax to set the initial icon based on the initial checked state of the checkbox.

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

<input class="check-box-image" type="checkbox" checked="@item.IsBusinessHours" id="checkbox1" disabled/><label for="checkbox1"></label>

编辑：
这是我最后的工作标记和脚本根据意外回答如下： / p>

Here is my final working markup and script as per accidentalgenius answer below:

@Html.CheckBox(@cbMobileId, @item.IsMobile, new { @class = "check-box-image", disabled = "disabled" })<label for="@cbMobileId">    

function setCheckBoxImages() {
        var checkboxes= $(".check-box-image");

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

        checkboxes.each(function () {
            $(this).change();
        });
    };

推荐答案

你可以循环遍历所有的jQuery按钮，每个的更改功能。

You could loop through all of the jQuery Buttons and call the change function for each one.

这篇关于jQuery-UI按钮设置初始图标的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！