如何根据AJAX结果主动增加计数器？

问题描述

| 我正在第一个ajax项目的最后一步。我制作了一个大拇指图标，当按下该图标时，将通过以下代码增加数据库中的列： 这是可见页面上的HTML和JQUERY

<div id=\"comment_id\">+1</div>
<div id=\"thumb_thumb\">                              
    <?PHP $comment_id = $result[\'id\'];?>
    <a class=\"myButtonLink\" href=\"Profile_test.PHP?id=<?PHP echo $prof->id; ?>\" id=\"<?PHP echo $comment_id; ?>\">Vote Up!</a>
</div>

    <script>
    $(\'.myButtonLink\').click(function(e) {
      e.preventDefault();
      var comment_id = $(this).attr(\'id\');
      $.ajax({ type: \'POST\',url: \'thumbs.PHP\',data: \'comment_id=\' + comment_id,success: function(data) {
                  alert(data);
                  if(data.result == \"error\") {
                      alert(data.msg);
                 } else {
                      $(\'#numVotes\').html(data.msg);
                 }
             }
      });
    });        
    </script>

这是发送到的隐藏的PHP页面

    <?PHP
     require_once($_SERVER[\'DOCUMENT_ROOT\']
     . \'/includes/system/init.PHP\');

     // 1. CHECK AND SEE IF THE
     \"$comment_id\" IS VALID. I AM GOING TO
     RETREIVE THE VALUE OF THE $_POST BEING
     SENT FROM THE PHP PAGE THAT IS SENDING
     THE REQUEST

     /* QUERY TO CHECK $_POST DATA WITH: */

    /* this is grabbing id that jquery
     sent over via post */
     if(isset($_POST[\'comment_id\'])) {


         /* making a variable out of the
     grabbed id */ $retreived_comment_id =
     $_POST[\'comment_id\'];  


     $query = \"UPDATE `CysticAirwaves` SET
     `thumbsUp` = `thumbsUp` + 1 WHERE `id`
     = \'\" . $retreived_comment_id . \"\'\"; $request =
     MysqL_query($query,$connection) ;
     $result = MysqL_fetch_array($request);


     }
   ?>

所以现在我只需要能够动态地使我的计数器工作，当单击一个拇指并将指定的注释在数据库中标记为加一时即可。

<div id=\"comment_id\">
            +1 //NEED TO MAKE THIS ACTUALLY COUNT
</div>

提前致谢     

解决方法

        

var currentCount = $(\'#comment_id\').text();

$(\'#comment_id\').text(++currentCount);

    ,        几件事。 1）您需要确保POST值是整数，而不是任意和/或恶意数据

$retreived_comment_id = filter_var($_POST[\'comment_id\'],FILTER_SANITIZE_NUMBER_INT);
if(!is_int($retreived_comment_id)) {
  echo \'error\';
  exit;
}

2）确保使用用户输入时所有数据均被转义是一个好主意

$query = \"
  UPDATE `CysticAirwaves` 
  SET `thumbsUp` = `thumbsUp` + 1 
  WHERE `id` = \".mysql_real_escape_string($retreived_comment_id).\"
\"; 

$request = mysql_query($query,$connection);

3）成功返回

\'success\'

，失败返回

\'error\'

$request = mysql_query($query,$connection);
if($request) {
  echo \'error\';      
} else {
  echo \'success\';
}

exit;

4）使用jQuery增加计数

success: function(data) {
  if(data == \"success\") {
    var $comment = $(\'#comment_id\');
    $comment.html($comment.text()+1);
  }
}

    ,        将这一行放在ajax成功请求处，而不是alert（data）

document.getElementById(\'comment_id\').innerHTML = data;

    ,        我注意到您没有从PHP代码返回任何内容到ajax。您需要返回一个至少包含\“ msg \”和\“ error \”的数组，才能满足您当前的成功代码。如果没有错误，则为\“ success \” => 1创建另一个数组元素。

//your php should return your array at the end of your function like this:
return array(\"msg\" => \"some message to return\",\"error\" => \"some error if you have one\",\"success\" => [1 or 0] );

//ajax function blah blah blah
success: function(data){
    if( data.success == 1 ){
        var currentCount = $(\"#comment_id\").text().substr(1);
        $(\"#comment_id\").text( currentCount+1 );
     }