8

以下は私のJqueryスライダー範囲（最小-最大）コードです。ドラッグはデスクトップコンピューターでは正常に機能しますが、iPadでこれをテストすると機能しません。誰でもこれで私を助けてくれますか?

残念ながら画像を添付できません。以下はスライダー範囲の図です。

=====(>)=======(<)=====

var maxValue,myRequest,isDown=false,setUrl;
setUrl = "/search_type/filter.php";

$( "#slider-range" ).slider({
    range: true,
    min: 0,
    max: 500,
    step:25,
    orientation: "horizontal",
    values: [ 0,500 ],
    slide: function( event, ui ) {

    if(ui.values[1] === 500)
    {
        maxValue = 500+"+";
    }
    else
    {
        maxValue = ui.values[1];
    }
        $( "#priceRange" ).val( "£" + ui.values[ 0 ] + " to £" + maxValue );
    }
});

// AJAX CALL 
$("#slider-range").find('a').mousedown(function(){
    isDown=true;
});
$(document).mouseup(function(){
    if(isDown)
    {
        return setAjaxRequest();
    }
});

// Decoration drag image
$( "#slider-range" )
.find('.ui-slider-handle')
.eq(0).addClass('a-right').end()
.eq(1).addClass('a-left');

//Default this is 
    $( "#priceRange" )
    .val( "£" + $( "#slider-range" )
    .slider( "values", 0 ) + " to £" + $( "#slider-range" )
    .slider( "values", 1 )+'+');
    return true;
4

3 に答える 3

20

これを試してくださいhttp://touchpunch.furf.com/

私はプロジェクトに使用しました、そしてそれは私がiPadとタッチデバイスで持っていた問題を解決しました

cdnjsでも利用可能

于 2012-08-14T20:59:51.133 に答える
5

提案どおり、http://touchpunch.furf.com/を使用しました。

そしてそれは完璧に機能しました！

私が使用したHTMLページに：

<script src="_js/jquery-1.9.1.min.js"></script>
<script src="_js/jquery-ui-1.10.1.custom.min.js"></script>
<script src="_js/jquery.ui.touch-punch.min.js"></script>

Slider Range の作成に使用した JavaScript コード:

var slider = $( "#dv_sliderrange" ).slider({
        range: true,
        orientation: 'horizontal',
        min: 0,
        max: 10000,
        step: 10,
        values: [ 0, 10000 ],
        // Update my own form fields with the Slider values
        slide: function( event, ui ) {
            $( "#fd_amount0" ).val( "$ " + ui.values[ 0 ]);
            $( "#fd_amount1" ).val( "$ " + ui.values[ 1 ]);
        }
    }).draggable();
于 2013-04-10T13:08:19.487 に答える
0

回答ありがとうございます。解決策を試してみましたが、最初はうまくいきませんでした。次に、機能を壊している js ファイルがもう 1 つあることに気付きました。jquery プログレス バー js でした。完全に機能するように削除しました。

于 2014-11-04T21:29:18.423 に答える