2 disneylu disneylu 于 2013.08.12 23:35 提问

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>
Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!