Javascript在XAMPP上的PHP中不起作用


Javascript not working in PHP on XAMPP

我一直在尝试让它工作,当我在其中一个或两个字段上单击少于 3 个字符的注册时,它不会弹出一个框,说明它应该说什么,当我单击注册时,上面有 3 个,它不会给出确认或错误,更不用说将信息插入数据库了。

<?php
    $sqlHost = 'localhost';
    $sqlUser = 'root';
    $sqlPass = 'hidthepassword';
    $sqlDatabase = 'RPG';
    $connection = new PDO('mysql:host='.$sqlHost.';dbname='.$sqlDatabase.';charset=utf8', $sqlUser, $sqlPass);
    $connection->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

    $username = null;
    $password = null;
    if(isset($_GET['user'])) {
        $username = $_GET['user'];
    }
    if(isset($_GET['pass'])) {
        $pass = $_GET['pass'];
    }
    if((isset($username)) && (isset($password))) {
        // TODO SQL
        $salt = genSalt(40);
        $passHash = md5(md5($salt) . md5($password));
        $statement = $connection->prepare("INSERT INTO `rpg`.`accounts` (`id`, `username`, `password`, `salt`) VALUES (:user, :pass, :salt);");
        $statement->bindParam(":user", $username);
        $statement->bindParam(":pass", $passHash);
        $statement->bindParam(":salt", $salt);
        if($statement->execute()) {
            echo "Thank-you for your registration, " . $username;
        } else {
            echo "Sorry, your registration failed.";
        }
    } else {
        // DISPLAY
            echo '<input type="text" id="user" placeholder="username"/>
        <input type="text" id="pass" placeholder="password"/>
        <button id="button">Register</button>
        <script>
            var r = document.getElementById("button");
            button.addEventListener("click", function() {
                var user = document.getElementById("user");
                var pass = document.getElementById("pass");
                if(user.value.length < 3 || pass.value.length < 3) {
                    alert("Please enter a valid username or password");
                } else {
                    window.location = "index.php?user="user.value+"&pass="+pass.value;
                }
            ));     
        </script>
        ';
    }
    function genSalt($length) {
        $variables = "aAbBcCdDeEfFgGhHiIjJkKlLmMnNoOpPqQrRsStTuUvVwWxXyYzZ0123456789";
        $charLength = strlen($variables);
        $returned = "";
        for($i = 0; $i < $length; $i++) {
            $returned .= $variables[rand(0, ($charLength - 1))];
        }
        return $returned;
    }
?>

您将按钮定义为r

var r = document.getElementById("button");

然后将事件侦听器绑定到名为 button 的 var :

button.addEventListener("click", function()

这应该在您的情况下r

此外,您应该为此使用POST而不是GET(或任何对您的应用程序/数据库/等进行更改的内容)

这里有一些错误:

首先,在 PHP 中,您从 $password 切换到 $pass 。所以修复它:

if (isset($_GET['pass'])) {
    $password = $_GET['pass']; // was $pass = $_GET['pass'];
}

在 JavaScript 中,我看到您的addEventListener代码有 3 个错误:

  • 正如其他人所提到的,您从r切换到button,而您打算使用相同的参考。
  • 您缺少一个加号 (+),您正在尝试将user.value连接到位置字符串。
  • 使用 "));" 关闭事件侦听器而不是"});",这是一个语法错误。

最终结果:

// was var r = ...
var button = document.getElementById("button");
button.addEventListener("click", function () {
    var user = document.getElementById("user");
    var pass = document.getElementById("pass");
    if (user.value.length < 3 || pass.value.length < 3) {
        alert("Please enter a valid username or password");
    } else {
        // was "index.php?"user.value ...
        window.location = "index.php?user="+user.value+"&pass="+pass.value;
    }
}); // was ));