无法更新文字，点击事件 [英] Unable to update text , on click of a event

问题描述

我有一个带有加号和减号按钮的div：

 < div class =col> 
< i class =minus>< / i> 
< i class =qt> 1< / i> 
< i class =plus>< / i> 
< / div> 
  

点击加号按钮，我想增加数量，同时减少数量，点击减号按钮。

为了实现这一点，我写了两个事件：

  $（document）.on（click，.minus，function（）{
 var quantity = $（this）.closest（ul）。find（i。 qt）。text（）; 
 var a = parseInt（quantity）; 
 a- = 1; 
 $（this）.closest（ul）。find（i。 qt）。text-a; 
}）; 
 $ b $（document）.on（click，.plus，function（）{
 var quantity = $（this）.closest（ul）。find（ i.qt）。text（）; 
 var a = parseInt（quantity）; 
 a + = 1; 
 $（this）.closest（ul）。find（i .qt）。text + a; 
}）; 
  

然而，按下哪个按钮并不重要，没有任何反应。

你能帮忙吗？

小提琴演示我的问题： http://jsfiddle.net/LESn3/2/

解决方案

您可以使用 .next（）和 prev（）来定位数量文本：

  $（document）.on（click，.minus，function（）{
 var quantity = $（this）.next（）。 text（parseInt（$（this）.next（）。text（）） -  1）; 
}）; 
 $（document）.on（click，.plus，function（）{
 var quantity = $（this）.prev（）。text（parseInt（$（this）.prev （）.text（））+ 1）; 
}）; 
  

演示

I have a div with a plus and a minus button:

<div class="col">
    <i class="minus"></i>
    <i class="qt">1</i>
    <i class="plus"></i>
</div>

On a click of the plus button, I want to increase the quantity and similarly decrease the quantity, when the minus button is clicked.

In order to realize this I have written two events:

$( document ).on( "click", ".minus", function() {
   var quantity = $(this).closest("ul").find("i.qt").text();
   var a = parseInt(quantity);
   a-=1; 
   $(this).closest("ul").find("i.qt").text-a;    
});

$( document ).on( "click", ".plus", function() {
   var quantity = $(this).closest("ul").find("i.qt").text();
   var a = parseInt(quantity);
   a+=1; 
   $(this).closest("ul").find("i.qt").text+a;
});

However, unimportant of what button is pressed, nothing happens.

Could you please help?

A fiddle showing my problem: http://jsfiddle.net/LESn3/2/

解决方案

You can use .next() and prev() to target the quantity text:

$( document ).on( "click", ".minus", function() {
  var quantity = $(this).next().text(parseInt($(this).next().text())-1);
});
$( document ).on( "click", ".plus", function() {
  var quantity = $(this).prev().text(parseInt($(this).prev().text())+1);
});

Demo

这篇关于无法更新文字，点击事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！