Javascript 中的按钮 onclick 事件不会触发警报答案

【问题标题】：Button onclick event in Javascript does not trigger alertsJavascript 中的按钮 onclick 事件不会触发警报
【发布时间】：2019-01-19 15:16:04
【问题描述】：

我正在尝试制作一个简单的注册/登录系统，但是当我按下两者的按钮时，它并没有做我需要它做的事情。

我放了

alert("I work!");

在每个应该工作的函数的开头查看它是否真的被触发但它没有。我还检查了两者的 onclick 事件是否被正确引用并且它们是正确的。我什至尝试将实际脚本复制到 html 文件中，以确保它不是参考问题。在这一点上，我真的卡住了，如果这是一些语法错误，它不会提醒我，我也不知道。

代码是：

index.html:

<!DOCTYPE html>
<html>
    <head>
        <title>Opportunities</title>
        <script type="text/javascript" src="jquery-3.3.1.min.js"></script>
        <script type="text/javascript" src="/js/script.js"></script>
    </head>
    <body>
        <p>Uwu</p>

        <form>
            <p>Username <input type="text" class="username" /></p>
            <p>Password <input type="password" class="password" /></p>
            <button onclick="loginUser()">Login</button>
        </form>

        <p>Not yet registered? <a href="/register">Click here to create an account.</a> </p>
    </body>
</html>

registration.html：

<!DOCTYPE html>
<html>
    <head>
        <title>Register</title>
        <script type="text/javascript" src="jquery-3.3.1.min.js"></script>
        <script type="text/javascript" src=/js/script.js"></script>
    </head>
    <body>
        <p>Registration page</p>

        <form>
            <p>Username <input type="text" class="username" /></p>
            <p>Password <input type="password" class="password" /></p>
            <button onclick="registerUser()">Register</button>
            <!--onclick event doesn't work-->
        </form>

        <p><a href="/">Click here to go back.</a></p>
    </body>
</html>

和 script.js：

var url = "http://localhost:8888";

function test(){
    console.log('hello');
}

function registerUser(){
    alert("I work!");
    var username = document.getElementbyClassName("username");
    var password = document.getElementbyClassName("password");

    $.ajax{(
        url: url + "/register",
        method: "post",
        data: {
            username: username[0].value,
            password: password[0].value
        }
        success: function(respons){
            alert(response.message);
        }
    }).error(function(response){
        alert(response.message);
    });
}

function loginUser(){
    alert("I work!");
    var username = document.getElementbyClassName("username");
    var password = document.getElementbyClassName("password");

    $.ajax({
        url: url + "/login",
        method: "post",
        data: {
            username: username[0].value,
            password: password[0].value
        }
    }).success(function(response){
        alert(response.message);
    }).error(function(response){
        alert(response.message);
    });
}

每当我按下每个按钮时，它只会清除我输入中的文本，但不会像我打算的那样启动警报。请告诉我我应该检查什么。谢谢。

【问题讨论】：

标签： javascript html button onclick alert

【解决方案1】：

我认为你的脚本没有加载

从

中删除第一个反斜杠（'/'）

  <script type="text/javascript" src=/js/script.js"></script>

【讨论】：

按钮参数中的 loginUser() 和 registerUser() 被定义为我希望它们被定义的内容。我也尝试删除斜线，但它仍然无法正常工作。
检查您的浏览器控制台？报告了什么错误

【解决方案2】：

如果您使用的是浏览器，我会首先尝试您没有任何“弹出”脚本阻止扩展，我遇到了同样的问题，问题是 chrome popup js 阻止程序导致简单的广告阻止程序不适用于某些网站。

干杯

【讨论】：

【解决方案3】：

看起来registerUser() 函数中的拼写错误尝试将 ajax 调用更改为

$.ajax({
    url: url + "/register",
    method: "post",
    data: {
        username: username[0].value,
        password: password[0].value
    },
    success: function(respons){
        alert(response.message);
    }
}).error(function(response){
    alert(response.message);
});

【讨论】：