PHP实现用户注册表单密码输入时长记录问题咨询

Got it, let's figure out how to track how long a user spends typing their password in your existing registration form. This is totally doable with a mix of frontend JavaScript and backend PHP—here's a step-by-step breakdown that fits your tech stack:

Step 1: Add Frontend Time Tracking with JavaScript #

You'll need to capture two key moments: when the user starts typing their password (focuses on the password field) and when they finish (either when they leave the field or submit the form). We'll store this duration in a hidden input to pass to PHP.

Add this script either in your HTML <head> (wrapped in DOMContentLoaded) or right before the closing </body> tag:

document.addEventListener('DOMContentLoaded', function() {
    const passwordField = document.getElementById('password');
    let startTime;

    // Capture start time when user focuses on password field
    passwordField.addEventListener('focus', function() {
        startTime = Date.now(); // Stores timestamp in milliseconds
    });

    // Option 1: Calculate duration when user leaves the password field
    passwordField.addEventListener('blur', function() {
        if (startTime) {
            const endTime = Date.now();
            const durationMs = endTime - startTime;
            document.getElementById('password_input_time').value = durationMs;
        }
    });

    // Option 2: Calculate duration when form is submitted (more accurate for users who jump between fields)
    const registrationForm = document.getElementById('registration_form');
    registrationForm.addEventListener('submit', function(e) {
        if (startTime) {
            const endTime = Date.now();
            const durationMs = endTime - startTime;
            document.getElementById('password_input_time').value = durationMs;
        }
    });
});

Step 2: Update Your HTML Form #

Add a hidden input field to hold the password input duration. Place it inside your existing <form> tag:

<form id="registration_form" method="POST" action="register.php">
    <!-- Your existing fields: name, password, confirm password, email -->
    <input type="text" name="name" id="name" required>
    <input type="password" name="password" id="password" required>
    <input type="password" name="confirm_password" id="confirm_password" required>
    <input type="email" name="email" id="email" required>

    <!-- Hidden field for password input time -->
    <input type="hidden" name="password_input_time" id="password_input_time" value="">

    <button type="submit">Register</button>
</form>

Step 3: Prepare Your MySQL Table #

Make sure your user table has a column to store the input duration. If it doesn't, run this ALTER query (adjust the column name and type as needed—INT works for milliseconds, or DECIMAL(5,2) if you want to store seconds):

ALTER TABLE users ADD COLUMN password_input_duration INT DEFAULT 0;

Step 4: Handle the Data in PHP #

In your register.php file, retrieve the hidden field value and insert it into MySQL along with the other user data. Here's a simplified example (make sure you're using prepared statements to prevent SQL injection!):

<?php
// Connect to MySQL (use your own DB credentials)
$conn = mysqli_connect('localhost', 'username', 'password', 'database_name');

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    // Sanitize and retrieve form data
    $name = mysqli_real_escape_string($conn, $_POST['name']);
    $password = password_hash($_POST['password'], PASSWORD_DEFAULT); // Always hash passwords!
    $email = mysqli_real_escape_string($conn, $_POST['email']);
    $passwordInputTime = isset($_POST['password_input_time']) ? (int)$_POST['password_input_time'] : 0;

    // Insert into database
    $query = "INSERT INTO users (name, password, email, password_input_duration) VALUES (?, ?, ?, ?)";
    $stmt = mysqli_prepare($conn, $query);
    mysqli_stmt_bind_param($stmt, 'sssi', $name, $password, $email, $passwordInputTime);
    mysqli_stmt_execute($stmt);

    // Handle success/error (redirect or show message)
    if (mysqli_stmt_affected_rows($stmt) > 0) {
        echo "Registration successful!";
    } else {
        echo "Error: " . mysqli_error($conn);
    }

    mysqli_stmt_close($stmt);
    mysqli_close($conn);
}
?>

Quick Notes: #

• Accuracy: If users tab away from the password field and come back later, the focus event will reset the start time. If you want to track total time spent across multiple focuses, you'd need to accumulate the duration instead of resetting startTime each time.
• Edge Cases: If a user submits the form without ever focusing the password field (unlikely, but possible), the duration will default to 0—we handle that in the PHP code with isset().
• Password Hashing: Always hash passwords before storing them in the database (like in the example above)—never store plain text passwords!

内容的提问来源于stack exchange，提问作者Abo Khalid