2

我正在使用:http ://api.jqueryui.com/spinner我该如何设置它,以便如果输入有 attr=disabled 它将禁用微调器?

<input type="checkbox" />
<input type="text" class="spinner" />

if($checkbox.attr("checked")){
   $input.removeAttr('disabled').spinner();
} else {
   $input.attr('disabled', true).spinner("option", "disabled", true);
}

此代码给我错误:在初始化之前无法调用微调器上的方法;试图调用方法“选项”

4

3 回答 3

3

jQuery UI 微调器默认启用/禁用方法,最好利用这些方法。此外,如果您想默认禁用微调器,只需将其输入设置为disabled="disabled"然后馈送this.disabled到微调器构造函数。this.disabled如果您使用这种方法,每次都向微调器构造函数提供数据是安全的,因为this.disabled=== trueifdisabled="disabled"this.disabled=== falseifdisabled属性不存在。

http://jsfiddle.net/A3SL4/

<html>
    <head>
        <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"/>
        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
        <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    </head>
    <body>
        <p>
            <label for="spinner1">Default Enabled Spinner</label>
            <input class="spinner" id="spinner1"/>
            <input checked="checked" onchange="enableSpinner('spinner1', this.checked);" type="checkbox"/>
        </p>
        <p>
            <label for="spinner2">Default Disabled Spinner</label>
            <input class="spinner" disabled="disabled" id="spinner2"/>
            <input onchange="enableSpinner('spinner2', this.checked);" type="checkbox"/>
        </p>
        <script type="text/javascript">
            $(".spinner").each(function() {
                $(this).spinner({
                    disabled: this.disabled
                });
            });

            function enableSpinner(spinnerId, enable) {
                var spinner = $("#" + spinnerId);
                if (enable) {
                    spinner.spinner("enable");
                } else {
                    spinner.spinner("disable");
                }
            }
        </script>
    </body>
</html>
于 2013-07-15T19:53:23.783 回答
2

您正在尝试在未创建微调器小部件时设置它的选项。相反,您可以使用构造函数选项调用您的微调器disable

if($checkbox.attr("checked")){
   $input.removeAttr('disabled').spinner();
} else {
   $input.attr('disabled', true).spinner({
      disabled: true
    });
}
于 2013-01-11T08:19:46.533 回答
2

试试这个:http: //jsbin.com/ojiwas/1/edit

$( ".spinner" ).prop('disabled',true);
  $(':checkbox').change(function(){
    if($(':checked').length>0){
      $( ".spinner" ).spinner();
    }else{
      $( ".spinner" ).spinner("destroy").prop('disabled',true);
    }
});
于 2013-01-11T08:45:16.740 回答