0

私はjQueryが初めてで、問題があります。

まず、私の問題を説明します。

OXID eコマースを使用したオンラインショップのサイトをコーディングしています。記事リストでは、いくつかのフィルターをインストールしたいと考えています。そのうちの 1 つが価格フィルターです。DB で最高価格と最低価格を読み取り、それを Cookie に保存して、ユーザーがこのフィルターが機能する間隔を選択できるようにします。というわけで、最初は記事一覧が全部読み込まれています。このリストは次のようになります。

すべての単一製品を含む div コンテナ:

その中には、次の各製品があります。

そして、製品内には、価格を含む別の div があります。

各製品には異なる ID があります。

<div id="productList">
  ...
  <div id="test_cntr_1_0015-0001-2250-0186 " class="product">
    ...
    <div class="form_wrapper">
      ...
      <form>
        ...
        <div class="price">1,99 €&lt;/div>
        ...
      </form>
      ...
    </div>
  ...
  </div>
...
</div>

細かいことは言わずに商品を購入できるので、中にフォームがあります。

つまり、ポイント:

ドキュメントの準備ができたら、ユーザーは「価格の境界」を設定できます。jQuery は、価格が境界内にないすべての製品を非表示にする必要があります。境界の値は Cookie を介して読み取られます。

私が今まで持っているものは次のとおりです。

$("#productList div.product div.price").each(function (index) {
  // What I should write here ?
}

実際に必要な div を 1 つずつ選択しているのはどれですか?しかし、どうすれば価格を比較できますか? つまり、内側の div 価格にアクセスし、それが境界内にあるかどうかを確認し、そうでない場合は値を hidden に変更しますか?

スクリプトに既に値があるとします。

本当にありがとう !

4

2 に答える 2

0

すべてのdiv.priceにdata-*属性を追加します。例:

<div class="price" data-price-value="1.99" data-price-unit="eur">1,99 €&lt;/div>

次に、次の方法でアクセスできます。

$("#productList div.product div.price").each(function (index) {
    var data = $(this).data(); // return {priceValue: 1.99, priceUnit: 'eur'} for the example div above
    // check the price range here by using data.priceValue
}
于 2013-03-07T17:26:29.917 に答える
0

Natthakit Susanthitanon の答えを拡張します。私はあなたが価格に縛られた入力を検証したと仮定しています -

<input id="upperBound" type="text">
<input id="lowerBound" type="text">

次に、これを行うことができます-

$("#productList div.product div.price").each(function (index) {
    var price = $(this).data("price-value");
    var lower = $("#lowerBound").val();
    var upper = $("#upperBound").val();
    if(price >= lower && price <= upper)
        $(this).parents(".product").show();
    else
        $(this).parents(".product").hide();
  });

編集:質問を読み直してください。Cookie にどのようにアクセスしていますか? jQuery で Cookie にアクセスする必要がある場合は、Git Hub の Klaus Hartl のプラグイン ( https://github.com/carhartl/jquery-cookie )をお勧めします。

于 2013-03-08T09:27:15.580 に答える