像按钮没有刷新整个页面

时间:2014-03-25 01:28:40

标签: javascript php jquery html ajax

我在网站上创建了一个类似的按钮。它是使用PHP完成的。当有人点击时,它会增加计数并将其更改为“不同”。类似地,当点击不同于计数减少时。

问题是当点击“赞”按钮时整个页面刷新。单击时,它会转到页面'like.php',它将执行增量,减量和其他操作,然后返回上一页。我听说使用ajax / jquery可以在不重新加载整个页面的情况下刷新div。我该怎么做。我是ajax / jquery的新手。

2 个答案:

答案 0 :(得分:0)

$.post( "ajax/test.html", function( data ) {
    $( ".result" ).html( data );
});

https://api.jquery.com/jQuery.post/

您可以使用.click进行点击活动。 http://api.jquery.com/click/

答案 1 :(得分:0)

假设你的喜欢按钮的属性为class =“like”而你的不同按钮的属性为class =“不喜欢”

这样的事情应该可以解决问题:

$(function() {
    $like = $(".like");
    $unlike = $(".unlike");

    if ($like.length) {
        $like.on('click', function() {
            $.ajax('like.php', { data: 'here' }, function(response) {
                // do something with your response from like.php:
                $like.addClass("unlike");
                $like.removeClass("like");
                $unlike = $like;
            });
        });
    }

    if ($unlike.length) {
        $unlike.on('click', function() {
            $.ajax('like.php', { data: 'here' }, function(response) {
                // do something with your response from like.php:
                $unlike.addClass("like");
                $unlike.removeClass("unlike");
                $like = $unlike;
            });
        });
    }
});

您需要将{ data: 'here' }更改为您要发送给like.php的任何数据。

response将保存like.php返回的数据,因此请确保它只是动作IE的JSON结果:

echo json_encode(array('result' => '1'));

echo json_encode(array('result' => '2'));

然后您可以在回调中测试if (response.result == 1) { var liked = true; }