Question

我试图通过点击一个链接来增加JavaScript中的变量，它第一次工作，但是如果我点击它一次它将会显示3次，然后是4,5，依此类推。控制台的屏幕截图： enter image description here

蓝色（右）中的数字与预期一致，没有任何问题，但正如您在左侧所看到的，每一行都是一次点击。第一个日志很好但是它记录了3次，然后记录了10次。

这是完成工作的代码。

$('.here').live('click', function(eve) {
    eve.preventDefault();

    var curpop = $(this).attr('rel')
    ++curpop
    $('.pop').html(curpop);

    console.log(curpop)
})

$(this).attr('rel')只是一个数字（在图片中为蓝色，右边），一旦你点击链接就可以增加数字。

谢谢你的帮助。

编辑：我在jsfiddle中设置了同样的东西，但它似乎在那里工作，所有的建议仍然不适用于我的项目，即使他们应该。

<h4 class='left'>Click
<a class="here" href="#" rel="1">here</a></h4>
<h4 class='right'>
    <span class='pop'>
        1
    </span>
</h4>

这是html，现在有多个这些但是通过ajax加载，我猜它会与类的多个实例有关，没有标识符来分隔它们？

更多编辑 我怀疑问题是“类的多个实例没有标识符来分隔它们”所以我只是将每个实例都这样：

<span id="<?php echo $thereID; ?>_span" class='pop'>
    1
</span>

然后

$('#' + thereID + '_span').html(curpop);

感谢所有帮助

Answer 1

需要查看更多代码，但通常我会看到JS初学者在事件中添加事件。换句话说，每次单击链接时，都会添加另一个事件处理程序。

无论如何，这是一个在点击处理程序中递增计数器的示例：http://jsfiddle.net/GSuSk/

Answer 2

<a href="#" id="link">GO UP</a>
<p>0</p>
<script>
    $('#link').click(function(){
            var v=$('p').text();
            $('p').text(+(v)+1);
    });
</script>

为什么不尝试这种方法？查看here了解演示

Answer 3

不确定这个有限的代码量，但如果我没有弄错，我认为一个问题是变量是在live中创建的，并且真的应该在外部初始化，这样它只需要抓取一次，然后从在那里，每次都不必抓住新的价值。这是我重新安排它的方式。 http://jsfiddle.net/robx/nDbb8/1/

Answer 4

    <script type="text/javascript">

    $(function(){

             $('.here li a').click(function(){
                 var current =  parseInt($(this).attr('rel'));
                 var inc = current + 1;
                 console.log(inc);
                 $(this).attr('rel',inc);
                }); 
    });
    </script>

    <div >
    <ul class='here'>
    <li><a href='#' rel="1">one</a></li>
    <li><a href='#' rel="10">two</a></li>
    <li><a href='#' rel="37">three</a></li>
    <li><a href='#' rel="1">four</a></li>

    </ul>

    </div>

我认为你不需要这里的实时函数...关键是使用parseInt来转换rel属性的当前值，因为它被评估为字符串......： - ）

JavaScript递增变量

4 个答案: