Jquery Mobile - 获取ajax结果问题

时间:2012-03-08 12:53:37

标签: php ajax jquery-mobile

尝试使用jquery mobile做一个简单的Web应用程序。我已经整理了一个简单的登录表单,其中显示了ajax结果。问题是我的ajax没有得到结果,即使我提醒看看URL是否有效。使用jquery mobile需要做些什么吗?

非常感谢任何想法/答案!

以下是HTML代码:

    <div data-role="page" id="login" data-theme="a" data-add-back-btn="true">
        <div data-role="header">
            <h2>Log in</h2>
        </div>
            <div data-role="content" data-theme="a" data-add-back-btn="true">   
                <form action="mobilelogin.php" method="post">
                  Email: <input type="text" name="email" id="useremail">
                  Password:  <input type="password" name="password" id="userpassword">
                <input type="submit" value="Enter">
                </form>
                <div id="loginresult"></div>
            </div>
        <div data-role="footer"><h4>Chris Sherwood Design 2012</h4></div>
    </div>

Js文件:

$(document).ready(function() {

  $('form').submit(function() {
  var emailchecker = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
  var email = $("#useremail").val();
  var userpassword = $("#userpassword").val();
  var checklength = userpassword.length;

  if(email == ""){
    alert('Please fill in email field');
     return false;
  }else if(userpassword == ""){
    alert('Please fill in password field');
     return false;
  }else if((!emailchecker.test(email))){
    alert('Please use a valid email');
     return false;  
  }else if(checklength < 6 || checklength > 6){
    alert('Password must be six characters');
     return false; 
  }else{
  var datastring = $(this).serialize();
  alert(datastring);
  return false;
        $.ajax({
        type: "POST",
        url: "mobilelogin.php",
        data: datastring,
        success: function(data){
        $("#loginresult").html(data);
        }
        });

  }

  });

PHP

<?php
echo 'nothing special here...';
?>

1 个答案:

答案 0 :(得分:2)

从你的代码:

return false;
    $.ajax({
    type: "POST",
    url: "mobilelogin.php",
    data: datastring,
    success: function(data){
    $("#loginresult").html(data);
    }
    });

您在ajax请求之前返回false。

编辑(假设这是一个简单的错误,添加了更多解释)

你需要移动返回false;在ajax()调用之下,或者像这样使用事件对象:

$('form').submit(function(e) {
    e.preventDefault();

使用return false的问题;如果在它之前有某个错误,它将不会停止默认操作。因此,如果您的ajax请求错误,它将错过返回false;并开始加载行动页面。