将mouseup函数转换为另一个函数并在jQueryUI滑块中使用它

时间:2015-12-25 09:44:09

标签: javascript jquery jquery-ui

我正在尝试重写一些在jQueryUI滑块上错误地使用mouseup事件而不是正确使用滑块停止事件的代码。

我的代码如下:

jQuery('body').on('mouseup', '.price-slider-range,.length-slider-range', function(e){

//Do something fancy
});

并且滑块代码如下所示:

    jQuery( ".length-slider-range" ).slider({
            range: true,
            min: <?php echo ($Priceresults['min_length']>0 ? $Priceresults['min_length'] : '0' ); ?>,
            max: <?php echo ($Priceresults['max_length']>0 ? $Priceresults['max_length'] : '0' ); ?>,
            values: [ <?php if($lengthMIN>0){ echo $lengthMIN;}else {echo '0';} ?>, <?php if($lengthMAX>0){ echo $lengthMAX; }else{ echo ($Priceresults['max_length']>0 ? $Priceresults['max_length'] : '0' ); } ?> ],
            slide: function( event, ui ) {  jQuery( "#length-amount" ).val(  ui.values[ 0 ] + "cm - " + ui.values[ 1 ]+"cm" );
            }
 });

我想知道如何将原始的mouseup函数转换为&#34; normal&#34;函数,然后在.slider停止事件中使用它,使它最终看起来像这样:

jQuery( ".length-slider-range" ).slider({
            range: true,
            min: <?php echo ($Priceresults['min_length']>0 ? $Priceresults['min_length'] : '0' ); ?>,
            max: <?php echo ($Priceresults['max_length']>0 ? $Priceresults['max_length'] : '0' ); ?>,
            values: [ <?php if($lengthMIN>0){ echo $lengthMIN;}else {echo '0';} ?>, <?php if($lengthMAX>0){ echo $lengthMAX; }else{ echo ($Priceresults['max_length']>0 ? $Priceresults['max_length'] : '0' ); } ?> ],
            slide: function( event, ui ) {  jQuery( "#length-amount" ).val(  ui.values[ 0 ] + "cm - " + ui.values[ 1 ]+"cm" );
            },

                stop: function(event, ui) { 
               //Do the fancy stuff from the now removed mouseup function
             }
 });

1 个答案:

答案 0 :(得分:0)

虽然我无法正确重写mouseup代码,但我选择了更简单的解决方法,将事件更改为双击:

jQuery('body').on('dblclick', '.price-slider-range,.length-slider-range', function(e){

//Do something fancy
});

并在停止时触发双击事件,如下所示:

jQuery( ".length-slider-range" ).slider({
            //range: true,
            range: "min",
            step: 0.01,
            min: <?php echo ($Priceresults['min_length']>0 ? $Priceresults['min_length'] : '0' ); ?>,
            max: <?php echo ($Priceresults['max_length']>0 ? $Priceresults['max_length'] : '0' ); ?>,
            values: [ <?php if($lengthMIN>0){ echo $lengthMIN;}else {echo '0';} ?>, <?php if($lengthMAX>0){ echo $lengthMAX; }else{ echo ($Priceresults['max_length']>0 ? $Priceresults['max_length'] : '0' ); } ?> ],
            slide: function( event, ui ) {  jQuery( "#length-amount" ).val(  ui.values[ 0 ] + "cm - " + ui.values[ 1 ]+"cm" );
            },
            stop: function( event, ui ) {
                jQuery(".length-slider-range").trigger( "dblclick" );
            }

它运作正常。