NZ-Switcher

• 应用实例

  • 基本应用

    演示代码：

    $("#check_dark").NZ_Switcher({ text: { open: "黑-开", close: "黑-关" } });
    $("#check_white").NZ_Switcher({ theme: "white", text: { open: "白-开", close: "白-关" } });
                        

  • 状态初始化

    原状态选中：
    初始化状态选中：
    禁用： 启用

    演示代码：

                            //目标原本状态为选中
                            $("#check_check").NZ_Switcher();
                            //初始化目标为选中
                            $("#check_ccheck").NZ_Switcher({ checked: true });
                            //禁用、启用
                            $("#check_disabled").NZ_Switcher({ disabled: true });
                            $("#btn_enble").click(function () {
                                if ($("#check_disabled").is(":disabled")) {
                                    $("#check_disabled").NZ_Switcher({ disabled:    false });
                                    $(this).text("禁用");
                                } else {
                                    $("#check_disabled").NZ_Switcher({ disabled:    true });
                                    $(this).text("启用");
                                }
                            });
                        

  • 触发式状态改变

    打开
    通过直接操作原checkbox状态即可操作渲染后的开关状态

    演示代码：

                            $("#check_change").NZ_Switcher();
                            $("#btn_change").click(function () {
                                if ($("#check_change").is(":checked")) {
                                    $("#check_change").removeAttr("checked").change();
                                    $("#btn_change").text("打开");
                                } else {
                                    $("#check_change").attr("checked", true).change();
                                    $("#btn_change").text("关闭");
                                }
                            });
                        

  • 单选Radio

    演示代码：

                            $(":radio[name='tradio']").NZ_Switcher();