Javascript jquery click（）和on（）不工作_Javascript_Jquery_Html_Click

Javascript jquery click（）和on（）不工作

javascript jquery html

Javascript jquery click（）和on（）不工作,javascript,jquery,html,click,Javascript,Jquery,Html,Click,在下面的代码中，单击（）不起作用我尝试$（“登录”）时遇到了什么问题？（“单击”，function（）{}）；功能也不起作用 <html> <head>  <link rel="stylesheet" href="bootstrap.min.css"> <link rel="stylesheet" href="style.css"> <head>

在下面的代码中，单击（）不起作用我尝试$（“登录”）时遇到了什么问题？（“单击”，function（）{}）；功能也不起作用

<html>

<head>

    <!--- Links --->
    <link rel="stylesheet" href="bootstrap.min.css">
    <link rel="stylesheet" href="style.css">

    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
        <script src="main.js"></script>
    </head>
    <!--html-->
    <title>Test Page</title>


    <script>
        $("#login").click(function() {
            alert("hai");
        });
    </script>
</head>

<body onload="$('#reg').toggle();">
    <div id="user-area">
        <div class="btn-area">
            <button id="btnlgn" class="btn btn-outline-primary" onclick="toggleReg()">Login /Register</button>

        </div>
        <div id="forms">
            <div class="form" id="reg">
                <form class="form-sigin" id="register">
                    <input type="text" class="form-control" placeholder="Email" id="email">
                    <input type="name" class="form-control" placeholder="Full Name" id="name">
                    <input type="password" class="form-control" placeholder="password" id="password">
                    <input type="password" class="form-control" placeholder="Re-enter password" id="conPassword">
                    <input type="tel" class="form-control" placeholder="Mobile Number" id="number">

                </form>
                <button class="btn" id="register">Register</button>
            </div>
            <div class="form" id="lgn">
                <form class="form-sigin" id="sigin">
                    <input type="text" class="form-control" placeholder="Email" id="emaillgn">
                    <input type="password" class="form-control" placeholder="password" id="passwordlgn">

                </form>
                <button class="btn" id="login">Login</button>
            </div>
        </div>
    </div>
</body>

</html>


测试页
$（“#登录”）。单击（函数（）{
警报（“hai”）；
});
登录/注册
登记
登录

我试图在按下按钮时显示警报

 <script>
            $("#login").on("click", function() {
                alert("hai");
            });

        </script>


$（“#登录”）。在（“单击”，函数（）{
警报（“hai”）；
});

这也不起作用

在页面上存在元素之前执行jQuery。将您的代码移动到页面末尾的关闭标记之前，或将其包装在调用中：

<html>

<head>

    <!--- Links --->
    <link rel="stylesheet" href="bootstrap.min.css">
    <link rel="stylesheet" href="style.css">

    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
        <script src="main.js"></script>
    </head>
    <!--html-->
    <title>Test Page</title>


    <script>
        $("#login").click(function() {
            alert("hai");
        });
    </script>
</head>

<body onload="$('#reg').toggle();">
    <div id="user-area">
        <div class="btn-area">
            <button id="btnlgn" class="btn btn-outline-primary" onclick="toggleReg()">Login /Register</button>

        </div>
        <div id="forms">
            <div class="form" id="reg">
                <form class="form-sigin" id="register">
                    <input type="text" class="form-control" placeholder="Email" id="email">
                    <input type="name" class="form-control" placeholder="Full Name" id="name">
                    <input type="password" class="form-control" placeholder="password" id="password">
                    <input type="password" class="form-control" placeholder="Re-enter password" id="conPassword">
                    <input type="tel" class="form-control" placeholder="Mobile Number" id="number">

                </form>
                <button class="btn" id="register">Register</button>
            </div>
            <div class="form" id="lgn">
                <form class="form-sigin" id="sigin">
                    <input type="text" class="form-control" placeholder="Email" id="emaillgn">
                    <input type="password" class="form-control" placeholder="password" id="passwordlgn">

                </form>
                <button class="btn" id="login">Login</button>
            </div>
        </div>
    </div>
</body>

</html>

您应该在body标记的末尾编写javascript代码。如果在头部标记之间使用，请使用下面的

<script>
    $(function() {
        $("#login").click(function() {
            alert("hai");
        });
    });
</script>


$（函数（）{
$（“#登录”）。单击（函数（）{
警报（“hai”）；
});
});