Home > Backend Development > PHP Tutorial > PHP anti-shake: Say goodbye to the trouble of repeated submissions

PHP anti-shake: Say goodbye to the trouble of repeated submissions

WBOY
Release: 2023-10-12 10:02:02
Original
1282 people have browsed it

PHP 防抖:告别重复提交的烦恼

PHP Anti-shake: Say goodbye to the trouble of repeated submissions

In developing web applications, form submissions are often encountered. However, due to network instability or improper user operation, users may submit forms repeatedly, causing trouble in data processing. In order to solve this problem, we can use PHP anti-shake technology to effectively avoid repeated submissions and improve user experience.

What is anti-shake?
Anti-shake is a commonly used front-end technology used to solve the problem of repeated operations caused by frequently triggered events. In PHP development, we can set an appropriate delay time to disable the form submission button within the specified time after the user submits the form to prevent the user from repeatedly clicking the submit button.

Specific implementation
Let’s demonstrate how to use PHP to implement the form anti-shake function. First, we need to add a piece of JavaScript code to the form page to disable the submit button. The code is as follows:

<script>
    function debounce(callback, delay) {
        let timer;
        return function() {
            clearTimeout(timer);
            timer = setTimeout(callback, delay);
        }
    }
  
    document.querySelector('form').addEventListener('submit', function(event) {
        event.preventDefault(); // 阻止表单默认提交
        let form = this;
        let submitButton = form.querySelector('button[type="submit"]');
      
        // 禁用提交按钮
        submitButton.disabled = true;
      
        // 1秒后重新启用提交按钮
        let enableSubmitButton = debounce(function() {
            submitButton.disabled = false;
        }, 1000);
      
        enableSubmitButton();
    });
</script>
Copy after login

In the above code, we define a function named debounce to implement the anti-shake function. This function accepts two parameters: callback is the callback function to be executed, and delay is the delay time. In the form submission event, we create a debounce function enableSubmitButton and bind it to the click event of the submit button. When the submit button is clicked, this function is triggered, disables the submit button, and re-enables the button after 1 second.

Next, we process it in the PHP backend code. First, we need to determine whether the form has been submitted once. In order to achieve this function, we can record the number of submissions by adding a hidden field to the form page. The code is as follows:

<form method="POST" action="submit.php">
    <!-- 其他表单字段 -->
    <input type="hidden" name="submitCount" value="0">
    <button type="submit">提交</button>
</form>
Copy after login

In the back-end PHP code, we need to judge the number of submissions and process them accordingly. The code is as follows:

<?php
session_start();

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $submitCount = isset($_POST['submitCount']) ? (int)$_POST['submitCount'] : 0;
  
    if ($submitCount === 0) {
        // 首次提交,进行数据处理
        // ...
      
        // 修改提交次数为1
        $_POST['submitCount'] = 1;
    } else {
        // 重复提交,直接返回响应
        echo '请勿重复提交!';
        exit;
    }
}
Copy after login

In the above code, we use the $_POST['submitCount'] variable to get the number of submissions. If the number of submissions is 0, the data will be processed and submitted. The number of times is modified to 1. If the number of submissions is not 0, it means that the user submitted repeatedly, and we directly return a prompt message to prevent the processing of the data.

Using the above code, we can implement the PHP anti-shake function, which improves the user experience while avoiding repeated submissions. It should be noted that due to different operation speeds of users, multiple submissions may occur within a very short period of time. Therefore, we can adjust the delay time in the code according to the actual situation to achieve better results.

Summary
By using PHP anti-shake technology, we can effectively prevent users from repeatedly submitting forms, reduce the processing of duplicate data, and improve user experience. In actual project development, proper use of anti-shake technology can greatly improve the performance and user experience of website applications. Using the above code example, you can easily implement PHP anti-shake function and say goodbye to the trouble of repeated submissions.

The above is the detailed content of PHP anti-shake: Say goodbye to the trouble of repeated submissions. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template