用ajax查询链接的点击次数

时间:2019-03-17 12:34:15

标签: javascript php ajax post

我必须计算链接的点击次数并将结果传递给php文件。我认为这是通过ajax查询完成的。

<a class='link' href='www.site.com'>Open</a>

<script>
var count=0;
$('.link').on('click',function(){
count+=1;
});
</script>

接下来我该怎么办?如何将计数传递给数组POST或Get?

2 个答案:

答案 0 :(得分:0)

如果要计算某个链接上的点击次数,则必须使用文件或数据库来保存该值,因为PHP不会保存状态。

在这里,我举例说明如何使用数据库:

  

Ajax

$('.link').on('click',function(){
  $.ajax({
      url:"<?php echo 'Your url to incrementCount() method';?>",
      method:"POST",
      data:{},
      success:function(response){
          // on success do something
      }                    
  });
});
  

PHP方法

public function incrementCount(){
  $UpdateQuery = "UPDATE link_counts SET link_count=link_count + 1 WHERE id=1";
  // here 'link_counts' is table name and 'link_count' is the column name to update
  $result = mysql_query($UpdateQuery );
}
  

“ link_counts”表

-------+------------+
|  id  | link_count |
-------+------------+

此处link_count列的默认值为0。这样,您可以在.link类的单击事件发生时更新该字段。

或者,您可以使用user_id来计数哪个用户单击了.link类。为此,您需要向更新查询中添加一些where条件。

如果要对文件执行此操作,请通过以下代码更改PHP方法-

  

用于文件处理的PHP方法

$file = 'link_counter.txt';

// default the counter value to 1
$counter = 1;

// add the previous counter value if the file exists    
if (file_exists($file)) {
    $counter += file_get_contents($file);
}

// write the new counter value to the file
file_put_contents($file, $counter);

希望这会有所帮助。

答案 1 :(得分:0)

要计算链接的点击次数,您应该传递诸如链接ID(来自db)的标识符或其他标识符,您可以使用该标识符来增加服务器上的计数-如果要尝试从中发送更新的计数客户将很容易受到滥用〜如果需要,修改计数非常容易。

您可以在下面未经测试的示例中使用ajax-它可能使您了解如何进行操作。

<?php

    /* test.php */

    if( $_SERVER['REQUEST_METHOD']=='POST' && !empty( $_POST['id'] ) && !empty( $_POST['url'] ) ){
        $id=$_POST['id'];
        $url=$_POST['url'];

        $sql='update `links` set `count`=`count`+1 where `id`=? and `url`=?';
        $stmt=$db->prepare($sql);

        if( $stmt ){
            $stmt->bind_param('is', $id, $url );
            $res=$stmt->execute();

            exit( $url );
        }
        exit( false );
    }


?>

还有html和javascript代码段

<a id=1 href='www.site.com' class='link'>Open Site</a>
<a id=2 href='www.example.com' class='link'>Open Example</a>
<a id=3 href='www.banana.com' class='link'>Open Banana</a>
<a id=4 href='www.spitfire.com' class='link'>Open Spitfire</a>
<a id=5 href='www.hellcat.com' class='link'>Open Hellcat</a>


<script>
    const ajax=function( url, params, callback ){
        with( new XMLHttpRequest() ){
            onreadystatechange=function(e){
                if( this.status==200 && this.readyState==4 )callback.call( this, this.response )
            }
            open( 'POST', url, true );
            setRequestHeader('Content-Type','application/x-www-form-urlencoded');
            send( params );
        }
    };

    const clickcallback=function(r){
        if( r )window.open( r )
    };

    const clickhandler=function(e){
        e.preventDefault();
        let url='test.php';
        let params='id='+e.target.id+'&url='+encodeURI( e.target.href );
        ajax.call( this, url, params, clickcallback  )
    };


    Array.prototype.slice.call( document.querySelectorAll('a.link') ).forEach( a=>{
        a.addEventListener('click', clickhandler );
    })
</script>