javascript - Jquery Post 无法正常工作？

Question

我一直在使用 jquery、ajax 和 php 研究 Like 和 Unlike 功能。我的问题有点难以理解。让我们先试着理解它。

---

我有 2 个 php 页面， viewProfile.php 和 LikeMail.php。 LikeMail.php 被 viewProfile.php 中的 ajax 函数调用。

这是 viewProfile.php 页面的部分描述

                             -----------------
                            |   Like/Unlike   |
                             -----------------

这是一个按钮，它实际上是通过这个 ajax 函数来自于 LikeMail.php

function like()
{
    var req  = new XMLHttpRequest();
    req.onreadystatechange = function()

    {
        if(req.readyState==4 && req.status==200)
        {
            document.getElementById('Like').innerHTML=req.responseText;

        }
    }
    req.open('POST','LikeMail.php','true');
    req.send();
}
setInterval(function(){like()},1000);

HTML:

<div id="Like"></div>

输出显示在这个 div 中。 上面的按钮可能是 Like 或 Unlike 取决于 LikeMail.php 中的条件，这将在下面的 LikeMail 中描述。 php 描述部分。

当其中一个(按钮)Like 或 Unlike 被点击时。然后它调用相应的 jquery 点击函数，将发布请求发送到 LikeMail.php。我在标题中提到了 Indirect 页面，因为 Like 或 不像 按钮实际上存在于LikeMail.php 页面中。但是由于 ajax 调用，这些按钮显示在 viewProfile.php 页面中。所以我然后通过 viewProfile.php 发送 post 请求到实际页面 LikeMail.php

它是 Unlike 的 jquery post 按钮

$(document).ready(function(){

    $('#Unlike').unbind().click(function(){
        $.post("LikeMail.php",
            {Unlike: this.id},
            function(data){
                $('#response').html(data);
            }

        );

    });

});

它是 jquery post 或 Like 按钮

$(document).ready(function(){

    $('#Like').unbind().click(function(){
        $.post("LikeMail.php",
            {Like: this.id},
        function(data){
            $('#response').html(data);
        }
        );

    });

});

viewProfile.php 页面的描述部分结束

---

这里是 LikeMail.php 页面的描述部分

Like 或 Unlike 按钮显示在 viewProfile.php 页面中取决于此代码:

$check_for_likes = mysqli_query($conn, "SELECT * FROM liked WHERE user1='$user1' AND user2='$user2'");
                $numrows_likes = mysqli_num_rows($check_for_likes);
                if (false == $numrows_likes) {
                    echo mysqli_error($conn);
                }

                if ($numrows_likes >= 1) {
                    echo '<input type="submit" name="Unlike" value="Unlike" id="Unlike" class="btn btn-lg btn-info edit">';


                }

                elseif ($numrows_likes == 0) {
                    echo '<input type="submit" name="Like" value="Like" id="Like" class="btn btn-lg btn-info edit">';
                }

按钮取决于以上两个条件。

现在，当点击Like 按钮时，来自viewProfile.php 的post 请求就会出现在这里

if(isset($_POST['Like']))   //When Like button in viewProfile.php is clicked then this peace of code inside if condition should run and insert some record in database
            {
                $total_likes = $total_likes+1;
                $like = mysqli_query($conn, "UPDATE user SET user_Likes = '$total_likes' WHERE user_id = '$user2'");
                $user_likes = mysqli_query($conn, "INSERT INTO liked (user1,user2) VALUES ('$user1','$user2')");
                $query3 = "INSERT INTO notification (user1, user2, alert, notificationType) VALUE ('$user1','$user2','unchecked','like')";
                if (mysqli_query($conn, $query3)) {
                    echo "Like";
                } else {
                    echo mysqli_error($conn);
                }

            }

与点击 Unlike 按钮时类似。这种和平代码应该运行。

if(isset($_POST['Unlike'])) //This is the condition for Unlike button. It should delete record from databse
            {
                $total_likes = $total_likes-2;
                $like = mysqli_query($conn, "UPDATE user SET user_Likes='$total_likes' WHERE user_id='$user2'");
                $remove_user = mysqli_query($conn, "DELETE FROM liked WHERE user1='$user1' AND user2='$user2'");
                $query3 = "DELETE FROM notification WHERE user1='$user1' AND user2='$user2' AND notificationType='like'";

                $check = mysqli_query($conn, $query3);
                if ($check) {
                    echo "Unlike";
                } else {
                    echo mysqli_error($conn);
                }
            }

问题:
我面临的主要问题是，当我单击 Like 或 Unlike 时，两者都会执行 Like 按钮代码的条件。两者都将数据插入数据库，因为 Unlike 条件应该从数据库中删除数据，但它也插入数据作为 Like 按钮的条件。请你能帮我解决这个问题吗？提前致谢!

更新:
当我删除Like按钮的所有相应代码时。 Unlike 按钮的条件开始正常工作。

Answer 1

我认为某处有重复的 ID，也许是 DIV。看看这个。

<div id="Like_2"></div>

<input type="submit" name="Unlike" value="Unlike" id="Unlike" class="btn btn-lg btn-info edit">

<input type="submit" name="Like" value="Like" id="Like" class="btn btn-lg btn-info edit">

<div id="response"></div>


$(document).ready(function(){
    $(document).on('click','#Unlike', function(){
        $('#response').html(this.id);
        //ajax call

    });
    $(document).on('click','#Like', function(){
        $('#response').html(this.id);
        //ajax call

    });
});

和 javascript 函数:

function like()
{
    var req  = new XMLHttpRequest();
    req.onreadystatechange = function()

    {
        if(req.readyState==4 && req.status==200)
        {
            document.getElementById('Like_2').innerHTML=req.responseText;

        }
    }
    req.open('POST','LikeMail.php','true');
    req.send();
}
setInterval(function(){like()},1000);

https://jsfiddle.net/wx38rz5L/2103/