单击时Jquery更新计数

时间:2012-10-15 20:42:31

标签: javascript jquery html

我有一个HTML代码段如下

var useful, cool, funny;

'<ul data-component-bound="true" class="voteset'+data[i]['review_id']+'">'+
    '<li class="useful ufc-btn" id="1">'+
      '<a href=javascript:vote('+data[i]['review_id']+',"useful") rel="useful"><span>Useful</span></a>'+
        '<span>'+useful+'</span>'+
    '</li>'+
    '<li class="funny ufc-btn" id="2">'+
      '<a href=javascript:vote('+data[i]['review_id']+',"funny") rel="funny"><span>Funny</span></a>'+
        '<span>'+funny+'</span>'+
    '</li>'+
    '<li class="cool ufc-btn" id="3">'+
      '<a href=javascript:vote('+data[i]['review_id']+',"cool") rel="cool"><span>Cool</span></a>'+
        '<span>'+cool+'</span>'+
    '</li>'+
    '<span class="vote'+data[i]['review_id']+'"></span></ul>'+
'</div>';

每个评论都有3个有用的按钮,很酷很有趣。当我执行点击操作时,如何在每个按钮内增加<span>计数。下面是我试过但不起作用。谢谢

function vote(reviewId,status) {
    $('.vote'+reviewId).text('posting ...');
    $('.voteset'+reviewId).click(function(){
      var updatevote = $(this).find("li>span").text();
      updatevote = updatevote + 1;
      $(this).next('span').html(updatevote);
    });
}

4 个答案:

答案 0 :(得分:2)

如果字符串为空parseInt

NaN会导致""问题,而是尝试Math.floor

function vote(reviewId,status)
{

    $('.vote'+reviewId).text('posting ...');
    $('.vote'+reviewId).text('posting ...');
        var $span = $('.voteset' + reviewId + ' li.' + status + ' span:eq(1)');
        $vote = Math.floor($span.text()) + 1; 
        $span.html($vote);
}

答案 1 :(得分:1)

您的updatevote将被解释为文字,而不是数字。尝试

var updatevote = parseInt($(this).find("li>span").text(), 10);

答案 2 :(得分:0)

试试这个

var updatevote = +$(this).find("li>span").text(); // Convert to number

updatevote++;

同样$(this).find("li>span")会给你一个包含li里面所有跨距的对象..我看到其中有三个在3个不同的li里面

你是如何处理的......

答案 3 :(得分:0)

您的事件绑定存在一般问题

function vote(reviewId,status) {
    $('.vote'+reviewId).text('posting ...');
    $('.voteset'+reviewId).click(function(){ // <-don't need this since you call vote directly from a#href
      var updatevote = $(this).find("li>span").text();
      updatevote = updatevote + 1;
      $(this).next('span').html(updatevote);
    });
}

这应该有效:

function vote(reviewId,status) {
    $('.vote'+reviewId).text('posting ...');

    var $span = $('.voteset' + reviewId + ' li.' + status + ' span');
    var updatevote = parseInt($span.text(), 10);

    updatevote = updatevote + 1;
    $span.text(updatevote);

}