Javascript中的按鈕onclick事件不會觸發警報

Question

我正在嘗試制作一個簡單的注冊/登錄系統，但是當我同時按下兩者的按鈕時，它無法完成我需要做的事情。

我放

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);
    });
}

每當我按下每個按鈕時，它只會清除輸入中的文本，但不會像我打算的那樣發出警報。 請告訴我該檢查什么。 謝謝。

Answer 1

我認為您的腳本未加載

從中刪除第一個反斜杠（'/'）

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

Answer 2

如果您使用的是瀏覽器，我將首先嘗試您沒有任何“彈出”腳本阻止擴展，我遇到了同樣的問題，問題是chrome popup js阻止程序導致簡單的adblocker在某些網站上不起作用。

干杯

Answer 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);
});

Javascript中的按鈕onclick事件不會觸發警報

問題描述

3 個解決方案

解決方案1
0 2019-01-19 15:22:39

解決方案2
0 2019-01-20 11:30:55

解決方案3
0 2019-01-20 11:56:56

Javascript中的按鈕onclick事件不會觸發警報

問題描述

3 個解決方案

解決方案1 0 2019-01-19 15:22:39

解決方案2 0 2019-01-20 11:30:55

解決方案3 0 2019-01-20 11:56:56

解決方案1
0 2019-01-19 15:22:39

解決方案2
0 2019-01-20 11:30:55

解決方案3
0 2019-01-20 11:56:56