Question

我有多个（有多少是未知的，因为它可以改变）<h3>标签具有相同的类.love_nummer

<h3 class="love_nummer">1</h3>

这些标签内部是一个数字，每个.love_nummer都带有另一个标签.give_love

<h3 class="give_love">LOVE</h3>

现在我想要点击.give_love时，只有<h3>标签内的数字（.love_nummer）与同一<div>内的数字相同.give_love会变高一个数字。这是我到目前为止所做的，但它不起作用：

$('.give_love').on("click", function(e){
      var love_givin = parseInt($(this).parent().find('.love_nummer').val());
      love_givin++;
    });

Answer 1

注意到您已使用.val()来获取无法使用的文字。相反，您应该使用.text()。

您需要替换为：

＆＃13;

$('.give_love').on("click", function(e) {
  var love_givin = parseInt($(this).parent().find('.love_nummer').text());
  $(this).parent().find('.love_nummer').text(++love_givin);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h3 class="love_nummer">1</h3>

<h3 class="give_love">LOVE</h3>

＆＃13;

Answer 2

val()适用于具有值属性的元素，h3不是这样的元素。请尝试使用text()，然后不要忘记更新它：

$('.give_love').on("click", function(e) {
  var element = $(this).parent().find('.love_nummer');
  var love_givin = parseInt(element.text());
  love_givin++;
  element.html(love_givin.toString());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<h3 class="love_nummer">1</h3>
<h3 class="give_love">LOVE</h3>

Answer 3

尝试此操作只会增加前一个文本的数量

＆＃13;

$('.give_love').on("click", function(e) {
var love_num=$(this).prev('.love_nummer');  
var love_givin = parseInt(love_num.text());
  love_num.text(++love_givin);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h3 class="love_nummer">1</h3>

<h3 class="give_love">LOVE</h3>

＆＃13;

Answer 4

好吧，看起来你计算它之后没有做任何更新值的事情。此外，由于您使用<h>代码更好地使用.text()，而不是.val()。

$('.give_love').click(function(e) {
  var love_givin = parseInt($(this).parent().find('.love_nummer').text());
  love_givin++;
  $(this).parent().find('.love_nummer').text(love_givin);
});

这是一个有效的例子：

https://jsfiddle.net/v35f6mpw/2/

在<h3>标记

4 个答案: