如何在onchange()事件后调用的方法中将焦点设置为输入字段?

时间:2009-01-20 19:23:43

标签: javascript javascript-events

我在验证后将焦点设置到输入字段时遇到了问题。

我有两个字段:从和到。

   <spring:message code="template.fields.label.from"/>: 
       <mvc:input  path="templateFields.selectorRangeFrom" 
       onchange="validateNumber('templateFields.selectorRangeFrom',true)"/>
   <spring:message code="template.fields.label.to"/>: 
      <mvc:input path="templateFields.selectorRangeTo"   
     onchange="validateNumber('templateFields.selectorRangeTo',true)"/>

我有方法validateNumber()验证字段,如果字段无效则返回false,否则返回true。 然而,焦点永远不会停留在无效数字上,它将永远是下一个对象。

function validateNumber(index,isInteger) {
 var object = document.getElementById(index);
 var value = object.value;   
 if (testNumeric2(value,isInteger)==false)   {
     alert('Please correct the value: ' + value);               
     object.focus();
     object.select();
     return false;  
 } 
return true;    
 }    

我发现如果我添加:event.returnValue = false(在返回false之前),那么它适用于IE。  但我找不到Firefox的解决方案。

感谢您的任何建议,  matali

2 个答案:

答案 0 :(得分:4)

setTimeout()允许你将函数的执行推迟几毫秒 - 如果你使用零,这只是意味着,“只要你完成了任何你就做到这一点“现在就做” - 在你的情况下处理这个事件。

试试这个:

if (! /** check field **/) {
   /** show error **/
   setTimeout((function() { object.focus() }), 0);
}

基本上你会创建一个能够聚焦输入框的函数,然后指示浏览器在完成事件的默认处理后立即调用它。

答案 1 :(得分:0)

我不确定 onChange 的返回false应该是什么意思。如果您只想重新关注问题区域,我建议您通过 setTimeout()调用来执行此操作(您必须在输入元素周围创建一个闭包)。

这样,当您尝试聚焦文本框时,事件处理将完成。

作为旁注,我还建议您不要使用 alert()来通知用户错误,因为它很刺耳,并且可能会在许多Windows上导致严重的意外声音系统。在故障控制旁边显示一个图标或红色边框可能是一种更好的方式来对待用户。