0

我想运行 ajax 来获取一个值,如果值为 true,则提交表单,代码如下使用 onsubmit=xxx ,但是这个表单会立即提交,而不是等待 ajax 结果。然后我想使用带有onclick功能的“a”标签来提交表单,这可以完成这项工作,但是当我使用“enter”键提交表单时,不会运行ajax代码。然后我想在光标位于输入字段时绑定按键以提交表单。如何检查光标是否在表单域中?

<?php 
    if(isset($_POST['act'])){
        $rs=array(
            'status'=>0
        );
        echo json_encode($rs);
        exit;
    }
?>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<div class="filters">
    <form onsubmit="return filters.submit()">
        <input type="text" name="name" />
        <input type="submit" value="submit" />
    </form>
</div>

<script type="text/javascript">
    var filters={
        form: $('.filters').find('form'),
        submit: function (){
            $.ajax({
                url:'index.php',
                type:'POST',
                data:{
                    act:'ajax'
                },
                success:function(rs){
                    eval('var rs='+rs);
                    if(rs['status']==1){
                        return true;
                    }else{
                        return false;
                    }
                }
            });
        }
    }
</script>
4

4 回答 4

2

正如@Rajesh Jinaga 所说document.activeElement,返回当前关注的元素,但我想向您解释为什么它不起作用。

当您进行 ajax 调用时,它不会等到 ajax 返回 true 或 false。它将执行。因此,您需要阻止提交表单,并在您的 ajax 调用完成时使用 javascript 提交。

HTML

   <form>
        <input type="text" name="name" />
        <input type="submit" value="submit" />
    </form>

JAVASCRIPT (jQuery)

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

        $.ajax({
            url:'index.php',
            type:'POST',
            data:{
                act:'ajax'
            },
            success:function(rs){
                // No need of EVIL eval('var rs='+rs);
                if(rs['status']==1){
                    $(this).submit(); // Will submit the form.
                }else{
                    alert("FAILED!");
                }
            }
            return false; // Shortcut for e.preventDefault() and e.stopPropagation() so it will prevent the form to be submitted.
        });
于 2013-11-04T04:53:54.117 回答
2

document.activeElement返回当前聚焦的元素,即,如果用户键入任何键,将获得击键事件的元素。

于 2013-11-04T04:27:54.583 回答
1

$(this).submit() 将不起作用,因为您处于不同的上下文中,并且成功回调调用程序发送 ajax 相关对象但不形成 DOM 对象。将对象存储到表单上下文中的变量中,并在成功回调中使用它。

 $(function(){
    $('form').submit(function (){
       var form = this;
        $.ajax({
            url:'index.php',
            type:'POST',
            data:{
                act:'ajax',
                status: $('[name=status]').val()
            },
            success:function(rs){
                eval('var rs='+rs);
                if(rs['status']==1){
                    $(form).submit();   // or $('form').submit()
                }else{
                    alert('error');
                }
            }
        });
        return false;
    });
});
于 2013-11-05T09:31:53.147 回答
0

@L105,谢谢你的回答,我修改了我的代码以匹配你的答案,但是表单无法使用 $(this).submit();

<?php 
    if(isset($_POST['act'])){
        $rs=array(
            'status'=> $_POST['status']
        );
        echo json_encode($rs);
        exit;
    }
?>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<div class="filters">
    <form action="index.php" method="post">
        <input type="text" name="status" />
        <input type="submit" value="submit" />
    </form>
</div>

<script type="text/javascript">
    $(function(){
        $('form').submit(function (){
            $.ajax({
                url:'index.php',
                type:'POST',
                data:{
                    act:'ajax',
                    status: $('[name=status]').val()
                },
                success:function(rs){
                    eval('var rs='+rs);
                    if(rs['status']==1){
                        $(this).submit();   // can't submit
                    }else{
                        alert('error');
                    }
                }
            });
            return false;
        });
    });
</script>
于 2013-11-04T05:36:30.573 回答