更新PHP页面而不刷新[关闭]

Question

我有一个div，它显示包含锚标记的文章，这些标记是“喜欢”和“不喜欢”按钮。当一些点击喜欢或不喜欢时，我想更新div，而无需刷新整个页面。这是div：

#Print out article and display information
echo "<article style='border: 2px solid #10466C;' class='topContent'>
        <header>
            <a class='article_title' href='article.php?article=$id'><h3>$title</h3></a>
        </header>

        <p class='date-author'>Date: $date <br /> Author: <span style='color: #10466C;'>$author </span> | Catagory: <a href='#'>$catagory</a> | Writer Level: $level<br />
        Comments: ($cmt_total) </p>

        <content>
            <img class='article-image' src='$image' />

            <div style = 'float: left; margin-left: 3%; width: 45%;'>
            <div class='like_box'>
               <a href='vote.php?vote=like&title=$title'><img src='img/like.png' class='vote'></a><p class='vote_text'>$like_num</p>
               <p style='color: #fff;'>$like_username</p>
            </div>

            <div class='dislike_box'>
                <a href='vote.php?vote=dislike&title=$title'><img src='img/dislike.png' class='vote'></a><p class='vote_text'>$dislike_num</p>
                <p style='color: #EC2800;'>$dislike_username</p>
            </div>

    </div>

    <div style='display: inline-block; margin-top: 10px;'>
        $text<a href='article.php?article=$title'><b>read more</b></a>
    </div>

</content>
<br />
<br />

</article> ";

}

如果您查看名为“like_box”和“dislike_box”的divs，您会看到 PHP 脚本喜欢的锚标记内部。

我的问题是如何运行该脚本而无需刷新页面并使用标题标签进行重定向。感谢您提供任何帮助，我愿意提供您可能需要的任何额外信息。我已经尝试了很多方法，我知道它需要 AJAX 或 JavaScript，无论哪种方式对我来说都无关紧要。

谢谢。

Answer 1

在更严肃的方面，回应;

如果有人可以写出一些伪代码或一些可以展示如何做到这一点的东西？

问题（很乐意提供进一步帮助，但我认为这可能有助于为您指明正确的方向）：

您需要设置一个触发点击；

<div class='dislike_box'>
    <a data-dislike="<?php echo $id; ?>">
         ...
    </a>
</div>

然后用 js 接下去；

document.querySelectorAll('a[data-dislike]').onclick = function() {
    // make an ajax call to your like/dislike script
    // and on success change the DOM somehow
};

然后在您进行// make an ajax call to your like/dislike script“调用”时调用的（可能是PHP）脚本中，您需要接收变量（通过ajax调用发送并在您的脚本中提取，例如data-like中的内容） /data-dislike attr 或类似）

然后，当您从 ajax 调用中获取这些变量并在您的 PHP 脚本中获取它们时，您可以执行数据库更新并返回一些内容（可能是 JSON），告诉客户端脚本“如何”更新 DOM，基于关于您从 ajax 调用中收到的内容。

如果这根本没有意义，请告诉我。