jQuery - UI滑块鼠标禁用并重新启用鼠标

时间:2012-03-19 21:20:38

标签: jquery jquery-ui slider jquery-ui-slider

是否可以禁用鼠标点击,而不是为jQuery UI滑块重新启用鼠标点击?

jQuery示例似乎无法正常运行

代码示例

使用指定的禁用选项初始化滑块。

$( ".selector" ).slider({ disabled: true });

在初始化后获取或设置禁用选项。

//getter
var disabled = $( ".selector" ).slider( "option", "disabled" );
//setter
$( ".selector" ).slider( "option", "disabled", true );

修改1

Heres是取消隐藏隐藏复选框的触发器....一旦点击它应该禁用滑块上的鼠标点击并允许复选框接管。

        $pageHelpYes.click(function () {

            $pageHelpHidden.animate({
                    'height': '650px'
            }, 1000);
            $pageHelpYes.attr('disabled', 'disabled');
            $("#R_C-designPrice2, #R_C-designPrice, #R_C-designAdded").addClass('R_C-added');
            $pageHelpNo.removeAttr('disabled');
            $("#designHidden").val('Yes');

            var checkedCount = $(":checkbox:checked").length;

            var s = $pageSlider,
                    val = s.slider("value", checkedCount),
                    step = s.slider("option", "step");
            s.slider("value", checkedCount);
            $pages.val(("value", checkedCount));
            $amount.val([("value", checkedCount) * pageAmount] / [$daySlider.slider("value")]);

  //Slider Mouse Disable Code below.....
            var kill = $("pagesSlider").slider("option", "disabled"); 
            $("pageSlider").slider( "option", "disabled", true );

            $slideCalc.click();

继承滑块代码。

    $pageSlider.slider({ 
            disabled: false,
            animate: true,
            range: "min",
            value: 5,
            min: 1,
            max: 25,
            step: 1,
            slide: function (event, ui) {
                    $pages.val(ui.value);
                    $slideCalc.click();


            }
    });

这是隐藏复选框的代码,应重新激活鼠标单击滑块。

     $pageHelpNo.click(function () {
            $pageHelpHidden.animate({
                    'height': '0px'
            }, 1000);
            $("#R_C-designPrice2, #R_C-designPrice, #R_C-designAdded").removeClass('R_C-added');
            $pageHelpYes.removeAttr('disabled');
            $pageHelpNo.attr('disabled', 'disabled');
            $("#designHidden").val('No');

  //Slider Re-activate Code below.....
            var kill = $("pagesSlider").slider("option", "disabled"); 
            $("pageSlider").slider( "option", "disabled", false );
    }); 

1 个答案:

答案 0 :(得分:3)

您已将滑块变量定义为:

$pageSlider.slider({    
    //... 
});   

然后你将disable方法称为:

$("pageSlider").slider( "option", "disabled", true );

所以问题是你为一个名为“pageSlider”的标签使用了一个选择器,我非常确定它永远不会存在。你必须使用你的滑块变量。

尝试像这样禁用滑块:

$pageSlider.slider( "option", "disabled", true );