Question

我正在创建一个关注按钮，或多或少像推特按钮。

您点击按钮，然后关注用户。

您再次点击，取消关注该用户。

我已经完成了这段代码

HTML

<div data-following="false" class='heart canal'><i class='fa fa-heart awesome'></i></div>

AJAX

$(document).ready(function() {
$(".heart.canal").click(function() {
    if($(".heart").attr("data-following") == '0'){
        $(".heart").attr('data-following', '1');
    } else if($(".heart").attr("data-following") == '1'){
        $(".heart").attr('data-following', '0');
    }

    var usuario = $(".left h4").attr("data-id");
    var seguidor = $("#user_account_info .profile_ball").attr("data-id");
    var seguir = $(".heart").attr("data-following");

    $.ajax({
        type: "POST",
        url: "./include/php/follow.php",
        data: { user: usuario, follower: seguidor, follow: seguir },
        success: function(response) {
            if(response == '0'){
                $(".heart").addClass("like");
            } else if(response == '1'){
                $(".heart").removeClass("like");
            }
        }
    });
    return false;
});
});

PHP

<?php
$dsn = "mysql:host=localhost;dbname=tapehd;charset=utf8";
$usuario = "root";
$contraseña = "";

$conexion = new PDO($dsn, $usuario, $contraseña);
$resultado = null;

$sql = "";
$user = $_POST["user"];
$seguidor = $_POST["follower"];
$follow = $_POST["follow"];

if($follow == '0'){
    $sql = "INSERT INTO seguidores(id_canal, id_seguidor) VALUES('$user', '$seguidor')";
} else if($follow == '1'){
    $sql = "DELETE FROM seguidores WHERE id_canal = '$user' AND id_seguidor= '$seguidor'";
}

if($conexion){ $resultado = $conexion->query($sql); }

return $follow;
?>

问题是，每次我点击按钮，我只在数据库中插入数据。我的意思是，我只创建了以下内容。当我点击两次时，它不会删除后续内容。

无论如何在data-following = true时插入数据并在data-following = false时将其删除？

已更新

我已经为2个字符串0和1更改了布尔值false和true。但它无论如何都不起作用。

Answer 1

这里有很多问题。首先，像@Mark说，你需要明白，当向PHP发送ajax请求时，你发送的是字符串。此外，在JS中，您将click函数绑定到.heart.canal，但随后该函数将更改该类的所有元素而不是实际单击的元素。最后，一旦您将正确的信息发送给PHP，您需要打印结果才能在ajax中看到它。

尝试以下方法：

JS：

$(document).ready(function () {
    $(".heart.canal").click(function () {
        var $heart = $(this);
        if ($heart.data("following")) {
            $heart.data("following", false)
        } else {
            $heart.data("following", true);
        }

        var usuario = $(".left").find("h4").data("id");
        var seguidor = $("#user_account_info").find(".profile_ball").data("id");

        $.ajax({
            type: "POST",
            url: "follow.php",
            data: {user: usuario, follower: seguidor, follow: $heart.data("following")},
            success: function (result) {
                if (result) {
                    console.log("true");
                } else {
                    console.log("false");
                }
            }
        });
        return false;

    });

});

PHP：

$user = (int)$_POST["user"];
$seguidor = (int)$_POST["follower"];
$follow = ($_POST["follow"] === 'true') ? true : false;

if ($follow) {
    // insert
} else {
    // delete
}

print $follow;

从PHP文件返回一个布尔值到AJAX one - Follow按钮

1 个答案: