1

SelecttoUISlider を使用してサイトのスライダー検索コントロールを作成しています。すべてがクロム、IE、および Windows Phone でうまく機能します。ただし、デスクトップ サファリまたは Apple デバイスでは、バックグラウンドでの選択の値は変わりません。'selected' 属性は変更されますが、select 要素の物理的な値は変更されません。その結果、バグのある結果が得られ、クエリ文字列が異なる値で結果ビューに 2 回渡され、エラーが発生します。

SelectToUISlider のかなり標準的な構文を使用しています。そして、基本的なjquery UIで動作することを確認しました

誰かがhttp://jsfiddle.net/847aypbb/を見たいと思った場合に備えて、この JSfiddle で select 要素を表示できるようにしました。 

$(document).ready(function () {
    //<![CDATA[
    // hide the select elements so that the sliders will take over
    //$('.suggest-wrap select').hide();
    // set up the sliders
    $('#group-experience').selectToUISlider({
        tooltip: false, labelSrc: 'text'
    });
    $('#distance-piste').selectToUISlider({
        tooltip: false, labelSrc: 'text'
    });
    $('#hotel-type').selectToUISlider({
        tooltip: false, labelSrc: 'text'
    });
    $('#ski-area').selectToUISlider({
        tooltip: false, labelSrc: 'text'
    });
});
4

2 に答える 2

0

jquery.ui.touch-punch "hack" スクリプトを含めて、iOS サファリでもスライダーが応答するようにする必要がありました。それを行った後、ドロップダウン値が設定されていないという同じ問題がありました。selectToUiSlider が古い jQuery を使用しているためだと思います。デフォルトの SliderOptions のスライド関数では、.attr関数を使用して選択されたオプションを設定します。これは要素の属性のみを設定し、DOM オブジェクトのプロパティは設定しないと思います。コードを次のように更新しました。

currSelect.find('option:selected').prop('selected', false);

currSelect.find('option').eq(ui.value).prop('selected', true);

最初の行は必要ないかもしれませんが、重要なのは.prop代わりに を使用することです.attr。

于 2015-12-18T18:07:25.140 に答える
0

SelectToUISlider には、一般的に iOS との互換性の問題があるようです。iPadでGoogle Chromeを使用しても、動作しませんでした。ただし、Android の Chrome では問題なく動作します。

jQueryUI の .slider() メソッドを使用することをお勧めしますが、より具体的な選択が必要な場合は、同じ問題が発生します。

于 2014-11-19T09:45:05.983 に答える