0

現在、div クラスとコンテンツに基づいてフィルターを作成しています。

次のような文字列を関数に渡すことができるかどうか疑問に思っていました: " £0.01 - £100.01"

そして、そのdivのhtmlがこの範囲の間にあるすべてのdivを関数に表示させます

「価格」のクラスを持つdivがあり、その内容は次のとおりです。£10.30

この関数を実行して " " の文字列を渡すと、£0.01 - £100.01以下の js で行った方法と同様にすべての div が非表示になり、div クラス "price" のコンテンツが選択した価格範囲内にある div のみが表示されます.

ここで提供するブランドフィルターを使用して、同様のことを行うことができました。

function brand(string){
    var brand = string;
    $('.section-link').hide();
    $('.section-link').children('.brand.' + brand).parent().show();
    if (brand == "All Brands"){
        $('.section-link').show();
    }
}

これを達成するために、一般的なアドバイスやコードは大歓迎です:)

ありがとう、サイモン

編集：

ターゲット div の例:

<div class="section-link">
<div class="price"> £56.99</div>
</div>

返信は大いに役立っています。フィルター機能はすばらしく見えますので、ご指摘いただきありがとうございます。

過去の最初の文字列を2つの値に分割し、£記号を削除するだけでなく、低い値と高い値に分割する方法を見つけようとしています

編集：

元の文字列を分割することができました：

var range = string.replace(/\u00A3/g, '');
var rangearray = range.split("-");
alert(rangearray[0]);
alert(rangearray[1]);

最終編集:

返信から、関数を作成することができましたが、完全に機能しているわけではありません:)誰かが私が間違ったことを見つけることができますか?

function price(string){
    $('.section-link').hide();
    var range = string.replace(/\u00A3/g, '');
    var rangearray = range.split("-");
    low = rangearray[0];
    high = rangearray[1];

     $('.section-link').children('.price').each(function() {
        var divprice = $(this).text().replace(/\u00A3/g, '');
        if (low <= divprice && high >= divprice){
             $(this).parent().show();
        }
    })
}

うまくいきました。文字列にスペースがありました。最終的な関数は (面倒ですが :P)、次のとおりです。

function price(string){
    $('.section-link').hide();
    var range = string.replace(/\u00A3/g, '');
    var rangearray = range.split("-");
    low = rangearray[0].toString();
    high = rangearray[1].toString();
    lowmain = low.replace(/ /g,'');
    highmain = high.replace(/ /g,'');

     $('.section-link').children('.price').each(
        function() {
            var divprice = $(this).text().replace(/\u00A3/g, '');
            var maindivprice = divprice.replace(/ /g,'');

            if (lowmain <= maindivprice && highmain >= divprice){
                $(this).parent().show();
        }
    })
}
4

4 に答える 4

1

jQuery の組み込み filter() 関数を使用して、説明した条件でフィルターを作成できます。

まず、すべてのアイテムを価格で非表示にする必要があります。

$(".price").parent().hide();

次に、価格が範囲内のすべてのアイテムをフィルタリングして表示できます。

$(".price").filter(function(){
    var $this = $(this);
    var value = $this.val();
    return (value >= minNumber && value <= maxNumber); // returns boolean - true will keep this item in the filtered collection

}).parent().show();
于 2013-07-22T12:32:24.557 に答える
0

私は次のように行きます：

  1. 価格を持つすべての div を取得します。
  2. すべてを繰り返す:
    1. 文字列 (シャープ記号を除く) を浮動小数点数に変換し、指定された範囲内にあるかどうかを IF ステートメントと比較します。
    2. それらが次へ進むだけの場合 (おそらくcontinueを使用してください)
    3. それ以外の場合 (範囲外) .hideなどのクラスを追加して、 css を介してブレンドできるようにします (または、jquery のブレンド関数を使用するだけです)。
于 2013-07-22T12:38:07.590 に答える