阿黄Ahuang 2020-01-01 13:08 采纳率: 50%
浏览 3120
已采纳

Web开发-登录界面点击登录按钮没反应

login.html

<!DOCTYPE html>
<html>
<head>
  <title>登录</title>
  <link rel="stylesheet" type="text/css" href="css/login.css">
  <script src="js/bootstrap.min.js"></script>
  <script src="js/jquery.min.js"></script>
  <script src="js/frame.js"></script>
  <meta charset="UTF-8">
</head>
<body>
  <div class="contain">
    <div class="logintop">
    </div>

    <div class="loginbody">
      <div class="logindiv">
        <form id="loginform" name="loginform" class="loginform">
          <ul>
            <li>
              <input name="username" type="text" class="loginuser" value="" placeholder="输入账号" maxlength="100" id="username" errormsg="密码长度在6-16位之间"/>
            </li>
            <li>
              <input name="password" type="password" class="loginpwd" value="" placeholder="输入密码" id="password" errormsg="密码长度在6-16位之间"/>
            </li>
            <li>
              <input name="btnRtSubmit" type="button" class="loginbtn"  id="btnRtSubmit" value="登录"/>
            </li>
          </ul>
        </form>
      </div>
    </div>

    <div class="loginbottom">
      版权所有 2019 Star-Net
    </div>
  </div>
</body>
</html>

frame.js

(function($){
    alert("1");
    function login(event){
        alert("2");
        event.preventDefault();
        var userName = $("#username").val();//获取用户名
        var password = $("#password").val();//获取密码
        //Ajax向后台提交用户名、密码
        alert("userName:"+userName+" password:"+password);
        $.post("/UserManager/loginController.do",{
            username:userName,
            password:password
        },
                function(data){
                    if((typeof(data)!="undefined")&&(null!= data)
                            &&(0==data)){
                //登录成功后隐藏登录表单
                $(".contain").hide();
                //登录成功后跳转到用户列表页
                $("#content").load("/UserManager/listUserController.do");
            }
        });
    }
    $("#btnRtSubmit").bind("click",login);//为btnRtSubmit绑定事件
})($);

我觉得问题应该出在frame.js上，但找不出问题在哪，大佬救我

  • 写回答

2条回答 默认 最新

  • 会飞的咕咕鱼 2020-01-02 19:02
    关注

    这样改就行了：

    function login(event) {
    // alert("2");
    event.preventDefault();
    var userName = $("#username").val(); //获取用户名
    var password = $("#password").val(); //获取密码
    //Ajax向后台提交用户名、密码
    alert("userName:" + userName + " password:" + password);
    $.post("/UserManager/loginController.do", {
            username: userName,
            password: password
        },
        function(data) {
            if ((typeof(data) != "undefined") && (null != data) &&
                (0 == data)) {
                //登录成功后隐藏登录表单
                $(".contain").hide();
                //登录成功后跳转到用户列表页
                $("#content").load("/UserManager/listUserController.do");
            }
        });
}
$(function() {
    $("#btnRtSubmit").bind("click", login); //为btnRtSubmit绑定事件
});

    造成你这个问题的原因：1. frame.js最外层的自调用函数，2 在login.html中在一开始引入了js ，这两个同时存在造成的

    建议：
    1.你可以看一下变量提升、函数提升以及页面加载顺序的相关知识
    2.为了前端性能优化，最好将js引入放在页面下方，css引入放在head里

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题？

悬赏问题

  • ¥15 用js遍历数据并对非空元素添加css样式
  • ¥15 使用autodl云训练，希望有直接运行的代码(关键词-数据集)
  • ¥50 python写segy数据出错
  • ¥20 关于线性结构的问题：希望能从头到尾完整地帮我改一下，困扰我很久了
  • ¥30 3D多模态医疗数据集-视觉问答
  • ¥20 设计一个二极管稳压值检测电路
  • ¥15 内网办公电脑进行向日葵
  • ¥15 如何输入双曲线的参数a然后画出双曲线？我输入处理函数加上后就没有用了，不知道怎么回事去掉后双曲线可以画出来
  • ¥15 soildworks装配体的尺寸问题
  • ¥100 有偿寻云闪付SDK转URL技术