前提
Javascriptの知識は初心者レベルのWebデザイナー(フロントはOK)です。
カートASPをカスタマイズしながら、一般的なECサイトをつくっています。
商品一覧ページで「セール商品を判別して、それだけ色を変える」
というような、元々のカートの機能にないことをしたいとのことで、
Javascriptを書いて実装したいのですがうまくいかず。
急ぎかつ周りに聞ける人がいなく。。ベテランの方のお知恵を借りたいです。
実現したいこと
各商品の [定価] と [販売価格] の数値を比較して
[定価] > [販売価格] の場合
liタグに nowsale というクラス名を加えたい。
なお、JQuery使える環境(のはず)です。
該当のソースコード
html
1<ul class="item-wrap"> 2 3 <li class="item"> 4 <a href="[商品詳細ページへのリンク]"> 5 <img src="[商品の写真]"> 6 <h3 class="item-name">[商品の名前]</h3> 7 <p class="item-consumerPrice"><span class="cp">[定価]</span>円(税込)</p> 8 <p class="item-taxPrice"><span class="tp">[販売価格]</span>円(税込)</p> 9 </a> 10 </li> 11 12 <li class="item"> 13 <a href="[商品詳細ページへのリンク]"> 14 <img src="[商品の写真]"> 15 <h3 class="item-name">[商品の名前]</h3> 16 <p class="item-consumerPrice"><span class="cp">[定価]</span>円(税込)</p> 17 <p class="item-taxPrice"><span class="tp">[販売価格]</span>円(税込)</p> 18 </a> 19 </li> 20 21 ・・・以下同様にリストが続く 22 23</ul>
試したこと
定価と販売価格をまず変数として定義させ、それらを比較して、
それに該当すればclassを加えれば良いのだから・・・
ということでここまで書きました。
これだとうまくいかなくて、
ループ的なものを使わないといけないのだろうなぁというところまでは予測していますが
知識不足で詰まっています。
javascript
1<script type="text/javascript"> 2 $(function() { 3 var CP = $('.cp').text(); 4 var TP = $('.tp').text(); 5 if(TP>CP){ 6 $('.item').addClass("nowsale"); 7 } 8 }); 9</script>
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/04/28 04:41 編集
2020/04/28 05:04
2020/04/28 05:47