我怎么能知道光标现在焦点在输入或textarea或选择

Question

我想运行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> 

Answer 1

作为@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. 
     }); 

Answer 2

document.activeElement返回当前焦点元素，也就是说，将获得按键事件如果用户键入的任何元素。

Answer 3

@ 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> 

Answer 4

$（本）.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; 
    }); 
});