Javascript wordpress/php：创建一个不刷新页面的upvote按钮

在这里开始开发，使用wordpress作为平台创建网站。我希望用户能够点击upvote按钮，在不刷新页面的情况下对帖子进行upvote。我想我应该使用javascript来突出显示单击后的按钮，以及更改投票数。但是，我很难弄清楚如何在不刷新页面的情况下运行php脚本（更新数据库）

---

提前感谢，

示例upvote php for posts将此添加到您的函数文件中

add_action('wp_ajax_upvote', 'upvote');
add_action('wp_ajax_nopriv_upvote', 'upvote');

function upvote() {
   $postid= $_POST['id'];
   $direction = $_POST['direction'];
   $votes= get_post_meta($postid, '_votes', true);

   if($direction='down') {
      $votes--;
   } else {
      $votes++;
   }

   update_post_meta($postid, '_votes', $votes);
   echo $votes;
   exit();
}

与提交任何形式的$\u POST变量一样，上述内容也需要安全性。不要在代码中遗漏这些

jQuery代码

jQuery(document).ready(function($){
    $('.arrow').click(function(){ //if your upvote has class arrow?
        //you need someway of passing postid to here!
        //if you want up / downvote -- logic needed here, if not remove direction from below!

        $.ajax({
           type: "POST",
           url: "/wp-admin/admin-ajax.php",

           data: {
              action: 'upvote',
              id: id,
              direction: direction //remove if not needed
           },

           success: function (output) { //do something with returned data

              console.log(output);
              jQuery('#postupvote').text(output); //write to correct id - maybe use postid in the id of the vote count on the page e.g. id="vote23" jQuery('#vote'+postid)
        }


        });
    });

})

---

google wordpress ajax了解更多信息

您可能正在寻找JQuery和ajax。使用Jquery的

$.ajax（）

函数，您可以异步下载站点。您好，大卫，谢谢您的回复。关于安全性的片段让我有点困惑。你能在这上面再扩展一点吗。我有其他表单正在发布数据，但我没有实现安全性。谢谢。安全意味着转义和验证用户输入，以防止恶意代码被上传，还包括名词+键。。。