问题描述
- jquerymobile写的一个登陆页面问题
-
用jquerymobile写了一个登陆页面，后台是spring3+mybatis，主要的思路是异步提交验证，如果验证失败，直接在页面上提示错误信息，验证成功则通过changePage刷新页面。遇到的问题是：
1、在spring的controller中返回这个页面后，登录页面虽然展现出来了，但是$(document).ready(function() {...})没有起作用，手工强制刷新页面可以起作用；
2、Ajax的POST方式没有起作用，点击按钮总是GET方式。。。页面代码如下，请各位大侠帮看下，真心感谢！
<%@ page language="java" pageEncoding="UTF-8" %> <%@ include file="/WEB-INF/views/include/taglibs.jsp" %> <!DOCTYPE html> <html> <head> <title>login</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" /> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script type="text/javascript"> function onSuccess(data, status) { data = $.parseJSON(data) //data = $.trim(data); if(data.flag == "Y") { //成功，进入新页面 $.mobile.changePage(data.url); } else { $("#message").css("color", "#ff0000"); $("#message").text(data.msg); } } $(document).ready(function() { alert("ready"); $("#btnLogin").click(function(e){ var formData = $("#frmLogin").serialize(); alert(formData); $.ajax({ type: "POST", url: "${ctx}/login", cache: false, data: formData, success: onSuccess }); e.preventDefault(); }); }); </script> <script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script> </head> <body> <div id="message"></div> <form id="frmLogin"> <label for="memberId">会员ID：</label> <input name="memberId" id="memberId" data-mini="true" data-clear-btn="true" type="text" autofocus required> <label for="password">密码：</label> <input name="password" id="password" data-mini="true" type="password" autofocus required> <br/> <div align="center"> <input value="提交验证" id="btnLogin" type=submit data-inline="true" data-mini="true" data-icon="check" data-theme="b"> <!-- <input value="重 填" type="reset" data-inline="true" data-mini="true" data-icon="delete" data-theme="b"> --> </div> </form> </body> </html>
时间： 2024-10-21 12:55:37