【问题标题】:Ajax return false to formAjax 返回 false 以形成
【发布时间】:2012-08-24 17:27:40
【问题描述】:

您好,我希望在用户注册我的网站时检查我的数据库,以确保他们选择的用户名不存在,如果确实让他们知道。我下面的代码不起作用,尽管无论我做什么并且表单总是提交,ajax 中的返回似乎都没有返回到我的表单中。为什么会这样?感谢您的帮助

HTML

<form name="signup" action="Test1.php" onsubmit="return checkUser();" method="get">
Username: <input type="text" name="user" />
<input type="submit" value="Submit" />
</form>

Javascript

<script type="text/javascript" src="jquery-1.7.1.min.js"/></script>
<script type="text/javascript">
    function checkUser(){
        var userV = document.signup.user.value;
        $.ajax({
            url: "Test.php",
            type: "POST",
            data: {user:userV},
            success: function (response) {
                if(response=="0"){
                    //Username already exists notify user
                    return false;
                }else{
                    return true;
                }
            }
        });
    }
</script>

Test.php

<?PHP
    $user = $_POST['user'];
    if($user=="test"){
        die("0");
    }else{
        die("1")
    }
?>

Test1.php

<?PHP
    echo "Form submitted";
?>

【问题讨论】:

  • 我面临着一个非常相似的问题。 stackoverflow.com/questions/12017823/…看看有没有答案可以帮到你
  • 第一个 JavaScript 问题。为什么我的异步调用不能同步工作。
  • 尝试从 onsubmit 中删除“return”。胡乱猜测。回去看看你的代码:P
  • 另外,就我的经验而言,您不需要使用 die,除非您希望页面代码停止并转储变量。只需使用回声。

标签: php javascript ajax forms


【解决方案1】:

您将 return 值放入 ajax 调用的 success 回调中,该回调的执行会延迟到服务器响应。

onsubmit="return checkUser();"checkUser() 函数中需要 truefalse 值:

function checkUser(){

   if( stuff )
      return true;
   else
      return false;

}

无论如何,这是一个整体不好的方法,因为它依赖于侵入式 javascript。更好的解决方案是将所有客户端逻辑移出标记:

HTML

<form name="signup" action="Test1.php" method="get">
    <label for="_user">Username:</label><input type="text" name="user" id="_user"/>
   <input type="submit" value="Submit" />
</form>

JS

<script>
// wrapping the code in a $(function(){ ... }); call delays its execution till document is loaded
$(function(){

$('form[name="signup"]').on('submit', function(event){

    // this prevents browser from actually following form url
    event.preventDefault();

    // a reference to the form to get used inside ajax callback
    var form = this;

    $.ajax({
         url: $(form).attr('action'),
         type: "POST",
         data: {user:$(form.user).val()},
         success: function (response) {
             if(response=="0"){

                alert('User exists!');

             }else{

                alert('User does not exist!');

             }
         }
     });

});

});
</script>

警报将是给用户的正确消息,或更复杂的验证 - 这只是为了举例。

【讨论】:

  • 对不起,我是新手 :) 这可能是一个愚蠢的问题,但你提供的 JS 我应该把它放在 和
  • 不要将 JS 放入&lt;head&gt;,而是在&lt;body&gt; 标签的最后[关闭它之前]:这样可以加快页面加载速度。查看我的编辑。
  • 不知道为什么,但是当我放置 ajax 时,没有任何东西成功运行,但是如果我将其注释掉并用警报代替它,它确实会运行。我的头部标签中仍然有 行,因此 ajax 应该运行,但由于某种原因它无法正常工作抱歉因为如此痛苦
  • 原来我错过了一个;在第二次死后的Test.php 大声笑终于发现代码可以完美运行!投票并接受!非常感谢
【解决方案2】:

你在回调中返回false,这太“晚了”,因为它会在请求完成时被调用。考虑在你的函数中添加一个显式的e.preventDefault()return false。目前,它将返回undefined,因为您在“内部”函数中定义了return 语句。

当然,您随后需要手动导航到目标页面。

或者将$.ajax()调用的asyncparameter显式设置为false

【讨论】:

    猜你喜欢
    • 2012-05-11
    • 2015-10-20
    • 1970-01-01
    • 2020-02-10
    • 2012-11-11
    • 2016-02-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多