在onblur不起作用的情况下验证字段后设置焦点

时间:2016-01-02 04:48:25

标签: javascript validation

花了一个小时或更长时间寻找替代方案之后,我才空无一人。失去焦点后,调用一个函数,在验证失败时将焦点设置回调用字段的部分不起作用...

这里的例子: http://owenparker.com/test/testval.php



var emptyString = /^$/;
function validatePresent(valfield,
  infofield) {
  var stat = commonCheck(valfield, infofield, true);
  if (stat != proceed) return stat;

  msg(infofield, "warn", "");
  return true;
}

var proceed = 2;

function commonCheck(valfield,
  infofield,
  required) {
  if (!document.getElementById)
    return true; // not available on this browser - leave validation to the server
  var infoelem = document.getElementById(infofield);
  if (!infoelem.firstChild) return true;
  if (infoelem.firstChild.nodeType != Node.TEXT_NODE) return true;

  if (emptyString.test(valfield.value)) {
    if (required) {
      msg(infofield, "error", "ERROR: required");
      setfocus(valfield);
      return false;
    } else {
      msg(infofield, "warn", ""); // OK
      return true;
    }
  }
  return proceed;
}

function msg(fld,
  msgtype,
  message) {
  var dispmessage;
  if (emptyString.test(message))
    dispmessage = String.fromCharCode(160);
  else
    dispmessage = message;

  var elem = document.getElementById(fld);
  elem.firstChild.nodeValue = dispmessage;

  elem.className = msgtype; 
}

function setFocusDelayed()
{
  global_valfield.focus();
}

function setfocus(valfield)
{
  // save valfield in global variable so value retained when routine exits
  global_valfield = valfield;
  setTimeout( 'setFocusDelayed()', 100 );
}

<table border=0 width=500px>
  <tr>
    <td>Misc 1:&nbsp;
      <input name="misc1" id="misc1" type="text" size="10" tabindex=1 autofocus onblur="validatePresent(this, 'inf_misc1');">
      <div id="inf_misc1">&nbsp;</div>
    </td>
  </tr>
  <tr>
    <td>Whatever:&nbsp;
      <select name="whatever" id="whatever" tabindex=2 onblur="validatePresent(this, 'inf_whatever');">
        <option value="" SELECTED>Choose</option>
        <option value="OPT1">Option 1</option>
        <option value="OPT2">Option 2</option>
      </select>
      <div id="inf_whatever">&nbsp;</div>
    </td>
  </tr>
</table>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

试试这个:

function setfocus(valfield)
{

  setTimeout( function () {
      valfield.focus();
  }, 100 );
}

使用全局变量将闭包传递给setTimeout