jquery settimeout和.focus（）一起在firefox浏览器中不工作 [英] jquery settimeout and .focus() together not working in firefox browser

问题描述

我有一个表单，当提交（空字段）在前端jsp显示弹簧验证的错误。我需要将显示屏重点放在前端显示的第一个错误信息中。从窗体生成的代码（通过视图源）：例如，在div元素中包含2个错误消息。我需要关注第一个错误消息。

 < div id =userid.errorsclass =lp >用户ID丢失< / div> 
< div id =age.errorsclass =lp> age is missing< / div> 
  

我尝试过下面的jquery代码，但它只适用于IE而不是Firefox。在firefox中，焦点不正常，但是正确处理CSS样式。

我确信语法和逻辑是正确的 - 有些人可以帮助我修复Firefox浏览器吗？

 < script type =text / javascriptsrc =/ scripts / jquery.min.js>< /脚本> 
< script type =text / javascriptsrc =/ scripts / jquery.validate.js>< / script> 
 
< script type =text / javascript> 
 
 $（document）.ready（function（）{
 $（[id $ ='。errors']：first）。css（background-color FFFFCC）; 
 setTimeout（function（）{
 $（[id $ ='。errors']：first）。focus（）; 
}，300）; 
 
}）; 
< / script> 
  

解决方案

我不明白你为什么试图集中精力div和你所期望的，通常你不能专注于div，但是你可以这样做，

  $ ）.ready（function（）{
 $（[id $ ='。errors']：first）。css（background-color，＃FFFFCC）; 
 setTimeout （）{
 $（[id $ ='。errors']：first）。attr（tabindex， -  1）.focus（）; 
 alert（document.activeElement.innerHTML +被重点关注）; 
}，300）; 
}）; 
  

http://jsfiddle.net/x7euD/3/

I have a form which when submitted(empty fields) displays spring validated errors in the front end jsp . I need to focus the display in the first error message displayed in the front end. Generated code from the form (via view source): For example 2 error message enclosed inside div element. I need to focus it on the first error message.

      <div id="userid.errors" class="lp">User id is missing</div>
      <div id="age.errors" class="lp">age is missing</div>

I tried the below jquery code, but it works only in IE and not in firefox. In firefox , focus is not working eventhough css style handled properly.

I am sure syntax and logic is correct - could some one help me out in fixing it for firefox browser ?

<script type="text/javascript" src="/scripts/jquery.min.js"></script>
<script type="text/javascript" src="/scripts/jquery.validate.js"></script>

 <script type="text/javascript">

 $(document).ready(function() {
$("[id$='.errors']:first").css("background-color","#FFFFCC");
     setTimeout(function(){
     $("[id$='.errors']:first").focus();
    },300);

 });
 </script> 

解决方案

I did not understand why you are trying to focus a div and what you expect, normally you can't focus a div, but you can do that like this,

$(document).ready(function() {
$("[id$='.errors']:first").css("background-color","#FFFFCC");
     setTimeout(function(){
         $("[id$='.errors']:first").attr("tabindex",-1).focus();
         alert(document.activeElement.innerHTML+ "is focussed");
    },300);
 });​​

http://jsfiddle.net/x7euD/3/

这篇关于jquery settimeout和.focus（）一起在firefox浏览器中不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！