jquery click()和on()不起作用

时间:2017-05-06 20:32:02

标签: javascript jquery html click

在下面的代码中click()不起作用 我尝试过什么问题$(“登录”)。on(“click”,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>

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

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

        </script>

这也不起作用

2 个答案:

答案 0 :(得分:1)

您在页面上存在元素之前执行jQuery。在结束</body>标记之前将代码移至页面末尾,或将其包装在document ready调用中:

$( document ).ready(function() {
    $("#login").click(function() {
        alert("hai");
    });
});

答案 1 :(得分:1)

你应该在身体标签的末尾写下javascript代码。如果您在头部标签之间使用,请使用以下内容。

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