Отслеживание количества кликов по каждой ссылке на странице

У меня есть цикл, который повторяет список ссылок, извлеченных из базы данных, но я хотел бы отслеживать, сколько раз каждая ссылка в списке является щелчком мыши.

форма

link1
link2
link3
link4
link5

к

link1 (2)
link2 (7)
link3 (3)
link4 (4)
link5 (1)

Таким образом, каждый раз, когда ссылка 1 нажата, количество раз, когда ссылка 1 нажата, должно быть записано и показано рядом со ссылкой.

Это код, который у меня есть до сих пор.

echo "<table>";
while($row = mysql_fetch_array($result)){   
//echo "<tr><td>" . $row['title'] . "</td><td>" . $row['url'] . "</td></tr>"; 
echo "<tr><td> <a href='" . $row['url'] . "' ' target='_blank'>" . $row['title'] . "</a> </td></tr>";
}
echo "</table>"; 

2 ответа

  1. Для управления всеми кликами можно использовать функцию javascript

    var counter = {};
    
    function manageClicks(url) {
    	if (! counter[url]) counter[url] = 0;
    	counter[url] ++;
    	alert('you clicked '+counter[url]+' '+url);
     
        // return location.href = url;
    	return false;
    }
    <p>
    Click some link:
    </p>
    <a href="#" onclick='manageClicks("url1")'> url1 </a><br>
    <a href="#" onclick="manageClicks('url2')"> url2 </a><br>
    <a href="#" onclick="manageClicks('url3')"> url3 </a><br>

  2. Вы можете сделать что-то подобное, чтобы сохранить его постоянно. Это просто основная идея с небольшим количеством кода. Я не проверял его.

    Также вам нужно сопоставить вашу ссылку и уникальный идентификатор, чтобы получить правильную ячейку в вашей базе данных.

    Материал frontend:

    <a href="http://yoururl.com/" onclick="handleLinkClick(this, 'a-unique-id')">
        Your link <span class="counter">(<?php echo getLogCount('a-unique-id') ?></span>)
    </a>
    

    Теперь, если пользователь нажимает на ссылку, вы можете сделать это:

    function handleLinkClick(element, urlId) {
        $.ajax({
            url: '/logurl.php',
            method: 'POST',
            data: {
               id: urlId
            }
        });
    
        // Count up immediately. You could also wait for a valid response. 
        var counterEl = element.querySelector('.counter');
        var currentCount = parseInt(counterElement.innerHTML);
    
        counterEl.innerHTML = (currentCount + 1).toString();
    }
    

    Backend материал:

    Для «getLogCount» можно определить функцию, которая возвращает клики из вашей базы данных (с PHP):

    function getLogCount($urlId) {
        $result = 0;
    
        // @todo: Request to the database and get the count of the "$urlId".
        // And save the result it in "$result"
    
        return $result;
    } 
    

    Теперь для регистрации клика пользователя в базе данных ваш » logurl.php » файл может выглядеть так:

    $urlId = intval($_POST['id']);
    
    // @todo: Update/Create a new entry in the database for the urlId.
    // Maybe the columns could look something like: urlId (unique), clicks
    

    Я надеюсь, что это поможет вам немного с вашей проблемой.