Question

fallowing表有许多相同的文本输入......

<table>
  <tr>
    <td>
      <a href="#" id="plus"><img src="plus.png" width="12" height="12" /></a>
      <input type="text" value="0" />
      <a href="#" id="minus"><img src="minus.png" width="12" height="12" /></a>
    </td>
    .
    .

    <td>
      <a href="#" id="plus"><img src="plus.png" width="12" height="12" /></a>
      <input type="text" value="0" />
      <a href="#" id="minus"><img src="minus.png" width="12" height="12" /></a>
    </td>
  </tr>
</table>

并且不再使用jQuery脚本应该增加/减少其壁橱文本输入的值......

 $("#plus").click(function(){
   var text = $(this).next(":text");
   text.val(parseInt(text.val(), 10) + 1);
 });

$("#minus").click(function(){
   var text = $(this).prev(":text");
   aux.val(parseInt(aux.val(), 10) - 1);
 });

问题是脚本只能在表的第一对链接上正常工作，将其最接近的文本输入的值递增和递减1，其余的剩余链接不会更改值其最接近的文本输入和更糟糕的是，链接在点击时传播到home/jthernandez/Desktop/test.html#网址。

我不确定这里有什么，但想法是每对+， - 链接分别改变其next（），prev（）文本输入的值。任何建议都会很棒。感谢

Answer 1

首先;没有HTML元素应该复制另一个元素的ID。

其次，因为事件只针对一组特定的元素，特别是具有该ID的第一个元素。我会考虑采用不同的策略：

<input type="text" value="0" id="text1">

<a href="#" class="minusLink" data-target="text1">Minus</a>

然后您可以像这样定位脚本：

$('.minusLink').click(function()
{
   var target = $('#' + $(this).data('target'));

   target.val(parseInt(target.val(), 10) - 1);
});

Answer 2

你很亲密。正如其他人所提到的，您不能多次拥有相同的ID。 ID是唯一的， IDentify 单个元素。 JavaScript只会在找到之前查找，然后停止。类用于对公共元素进行分组。使用一个类，您的代码应该可以正常工作（减去javascript中的拼写错误）：

HTML：

<td>
    <a href="#" class="plus"><img src="plus.png" width="12" height="12" /></a>
    <input type="text" value="0" />
    <a href="#" class="minus"><img src="minus.png" width="12" height="12" /></a>
</td>

JS（您在减号中输入错误，创建text，但使用aux）：

$(".plus").click(function(){
    var text = $(this).next(":text");
    text.val(parseInt(text.val(), 10) + 1);
});

$(".minus").click(function(){
    var text = $(this).prev(":text");
    text.val(parseInt(text.val(), 10) - 1);
});

演示：http://jsfiddle.net/jtbowden/bfM9Z/

Answer 3

你应该引用类而不是id，因为你看到按id选择只检索第一个匹配

Answer 4

元素上的ID只能出现一次。相反，将ID更改为class。

使用jQuery输入的许多类似文本之一的递增/递减值

4 个答案: