Button click counter

Question

Я пытаюсь создать счетчик кликов, который при каждой загрузке увеличивается. Я хочу использовать его без базы данных, это код:

<?php 

    $counterFile = 'counter.txt' ; 

    // jQuery ajax request is sent here 
    if (isset($_GET['increase'])) 

    { 
     if (($counter = @file_get_contents($counterFile)) === false) die('Error : file counter does not exist') ; 
       file_put_contents($counterFile,++$counter) ; 
       echo $counter ; 
       return false ; 
      } 

      if (! $counter = @file_get_contents($counterFile)) 
      { 
       if (! $myfile = fopen($counterFile,'w')) 
        die('Unable to create counter file !!') ; 
       chmod($counterFile,0644); 
       file_put_contents($counterFile,0) ; 
      } 

     ?> 
     <script type="text/javascript"> 
      jQuery(document).on('click','a#download',function(){ 
       jQuery('div#counter').html('Loading...') ; 
       var ajax = jQuery.ajax({ 
        method : 'get', 
        url : '/test.php', // Link to this page 
        data : { 'increase' : '1' } 
       }) ; 
       ajax.done(function(data){ 
        jQuery('div#counter').html(data) ; 
       }) ; 
       ajax.fail(function(data){ 
        alert('ajax fail : url of ajax request is not reachable') ; 
       }) ; 
      }) ; 
     </script> 
    <div id="counter"><?php echo $counter ; ?></div> 
    <a href="<?php echo get_field("pdf"); ?>" id="download" onclick="window.open(this.href);return false;">Download btn</a> 

Проблемы заключается в том, что, когда я нажимаю на Download btn Ф открываются, но номер пропадает, и если я перезагрузить страницу всегда остается на 0. Любая идея, где и в чем проблема?

Answer 1

Перезагрузка идет по ссылке (в конце концов, это ссылка, которая будет перезагрузить страницу).

Либо вернуть ложь:

jQuery(document).on('click','a#download',function(){ 
     ... 
     return false; 
    }); 

Или предотвратить действие по умолчанию с preventDefault()

jQuery(document).on('click','a#download',function(e){ 
     e.preventDefault() 
     ... 
    }); 

Вы используете одновременно onclick= атрибут и обработчик событий JQuery на той же кнопке. Это нехорошая ситуация.

Лучше всего использовать только jQuery для обработчиков. например

jQuery(document).on('click','a#download',function(e){ 
     e.preventDefault() 
     window.open(this.href); 
     ... The other code ... 
    }); 

и удалите onclick="window.open(this.href);return false;" с кнопки.