Question

我用jquery写了一个类似的按钮，但我在条件方面遇到了一些问题。

我遇到的其他问题是使用total_likes计数器：如果我单击并点击不像计数器设置为0但是如果我再次喜欢te计数器转到2而不是1 ...

php / html：

if (total_likes > 0) {
    $hide = 'block';
} $hide = 'none';

$photos_box .= '<input type="hidden" class="tl' . $imgID . '" value="' . $total_likes . '" />
<a id="' . $imgID . '" class="like_button" title="' . $like_title . '">' . $like . '</a>

//the counter
<a id="" style="display: '. $hide . '">
    <span id="color" class="mod' . $imgID . '">' . $total_likes . '</span>
</a>
// the text
<li id="counter" style="display: ' . $hide . ';">
    <div id="">
        <span class="text_color">' . $text . '</span>
    </div>
</li>

jquery脚本：

$('.like_button').click(function() {

    var total_likes = $('.tl'+this.id).val();
    total_likes = parseInt(total_likes);

    var status = '';

    if ($(this).html() == 'Like') {
        status = 'like';

        $(this).html('Unlike');
        $(this).attr('title', 'Unlike this');
        $('.mod'+this.id).html(total_likes+1);

        if (total_likes == 0) {
            $('#counter').slideToggle('fast');
            $('.text_color').html('Like this.');
        } else if (total_likes == 1) {
            $('.text_color').html('You and <a id="A_112">other</a> like this.');
        } else if (total_likes > 2) {
            var tl = total_likes+1;
            $('.text_color').html('You and <a id="A_112">'+tl+' others</a> like this.');
        }
    } else if ($(this).html() == 'Unlike') {
        status = 'unlike';

        $(this).html('Like');
        $(this).attr('title', 'Like this');
        $('.mod'+this.id).html(total_likes-1);

        if (total_likes == 0 || total_likes == 1) {
            $('#counter').slideToggle('fast');
        } else if (total_likes == 2) {
            $('.text_color').html('<a id="A_112">1 person</a> like this.');
        } else if (total_likes > 2) {
            var tl = total_likes-1;
            $('.text_color').html('<a id="A_112">'+tl+' people</a> like this.');
        }
    }

    var data = {
        img_id : this.id,
        sta    : status
    };

    $.ajax({
        type : 'POST',
        url  : '/includes/like.php',
        data : data
    }).done(function(result) {
        console.log(result);
    });
});

使用jquery和实时更改是一团糟......我不确定条件是否正确无法执行所需的操作。

我不知道为什么like_counter-1正在做-2而且like_counter + 1正在做+2 ......

我做错了什么？

Answer 1

你不需要打印两次$ total_likes ...只需使用你的实际计数器：

var total_likes = $('.mod'+this.id).html();

Answer 2

老实说，你可能想要使用一些模板引擎，比如Smarty或其他一些工作，因为它会导致凌乱的代码声音或更晚。

您遇到的问题是因为您没有将更新后的值分配给隐藏字段。所以最终你要将值替换一次，但是你再次从字段中获取未更新的值

$('.tl'+this.id).val();

所以你可能喜欢这样做

total_likes = total_likes+1
$('.mod'+this.id).html(total_likes);
$('.tl'+this.id).val(total_likes);

希望这会有所帮助

快乐学习：）

如果条件，jquery单击不能正确更改文本/数字

2 个答案: