2

jQuery / Javascriptの知識がほとんどないため、これに2日間苦労しました。何度も徹底的に検索したと思いますが、必要な答えが得られませんでした。

私はWordpressループで作業しています。各ループ項目には、クラスを含むスパンと、jQueryを介してそのスパンの値/コンテンツへの更新をトリガーするリンクがあります。

私が持っているのは、トリガーリンクをクリックすると、最初のループアイテムで、すべてのアイテムループのスパンの値/コンテンツのすべてが更新されるとしましょう。私が達成しようとしているのは、最初のループ項目のトリガーリンクをクリックすると、そのループ項目のみのスパンの値/コンテンツを更新するという単純なものです。

HTMLは次のとおりです。

<div class="loop-item>
 <span class="count">123</span>
 <span><a class="update"></a></span>
 <p>some text</p>
</div>

<div class="loop-item>
 <span class="count">123</span>
 <span><a class="update"></a></span>
 <p>some text</p>
</div>

<div class="loop-item>
 <span class="count">123</span>
 <span><a class="update"></a></span>
 <p>some text</p>
</div>

<div class="loop-item>
 <span class="count">123</span>
 <span><a class="update"></a></span>
 <p>some text</p>
</div>

jQuery は次のとおりです。

$(document).ready(function(){
 $(".update").click(function(){
  var countVal = $(".count").text();
  var nuVal = countVal + 1;
  $(".count").text(nuVal);
 });
});

完全に間違った jQuery コードであることはわかっています。私は喜んで学び、ここの誰かがそれを正しくするのを喜んで手伝ってくれることを願っています.

ありがとう。

アップデート：

動作する jQuery コードは次のとおりです (nuVal 変数を変更)。

$(document).ready(function(){
 $(".update").click(function(){
  var countSpan = $(this).closest(".loop-item").find(".count");
  var countVal = countSpan.text();
  var nuVal = parseInt(countVal) + 1;
  countSpan.text(nuVal);
 });
});

ありがとうございました！

4

3 に答える 3

1

click() コールバック内では$this、<span class="update">. したがって、これを行うためのベースとしてその祖父母を選択できます。

$(document).ready(function(){
 $(".update").click(function(){
  var base = $(this).parent().parent(); //loop-item
  var nuVal = base.find(".count").text() + 1;
  base.find(".count").text(nuVal);
 });
});
于 2013-05-19T00:40:24.347 に答える
1

これは簡単です。最初に2つの主な問題が見られます。あなたがここで言っていることは次のとおりです。

$(".count").text(nuVal);

クラス数ですべてのアイテムを変更しています。

次に、ループ アイテム div のクラスの最後に引用符がありません。

<div class="loop-item>

私が正しく理解している場合、あなたはこれを達成しようとしています: クラス「更新」のリンク要素をクリックすると、同じループ項目 div 内のクラス「カウント」のスパン要素のみの値が変更されます。

そのタスクを達成する方法は次のとおりです。

$(document).ready(function(){
 $(".update").click(function(){
  // get the container of class .loop-item and grab the span element of class count
  // and store that element in the countSpan variable
  var countSpan = $(this).closest(".loop-item").find(".count");

  var countVal = countSpan.text();
  var nuVal = countVal + 1;
  countSpan.text(nuVal);
 });
});
于 2013-05-19T00:47:09.270 に答える
0

これを試して;

$(document).ready(function(){
   $(".update").click(function(){
      var parent = $(this).parent('span').parent('div');
      var countVal = $(".count", parent).text();
      var nuVal = countVal + 1;
      $(".count", parent).text(nuVal);
   });
});

基本的に、クリックしたアイテムの親を取得し、それを使用して必要なインライン要素を選択する必要があります。

于 2013-05-19T00:39:57.197 に答える