Question

我有一个真正的基本形式（下面的代码）和一堆背板PhP。有一个扫描仪用于输入数据，但是在每个项目之后没有标签，它会发送一个“输入”命令。

是否可以添加javascript以使enter键改为Tab键到下一个表单字段，并在最后一个表单字段上提交它？我在网上找到了一些脚本，但我没有尝试过在Firefox / Chrome中使用过的脚本。

CODE：

<html><head><title>Barcode Generation</title></head><body>
<fieldset style="width: 300px;">
<form action="generator.php" method="post">
Invoice Number:<input type="text" name="invoice" /><br />
Model Number:<input type="text" name="model" /><br />
Serial Number:<input type="text" name="serial" /><br />
<input type="hidden" name="reload" value="true" />
<input type="submit" />
</form><br /><a href=null>en espanol</a></fieldset>
</body></html>

Answer 1

是

您需要为表单执行'onsubmit'处理程序，该处理程序检查从“正确”字段中按下[ENTER]键（或表单是否已充分填充）。如果没有，处理程序应该只返回false（以防止提交）。（只需要做下一位。）

然后你需要为每个可以扫描的输入实现一个'onkeypress'处理程序，当你得到[ENTER]键时，~~调用.preventDefault（）~~阻止提交表单，~~触发[TAB]'keypress'事件~~ .focus（）下一个字段。

更新：这对我有用：

<html>
  <head>
    <title>Barcode Generation</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">

      function validate() {
        return ((/\S+/.test($('input[name="invoice"]').val())) &&
                (/\S+/.test($('input[name="model"]').val())) &&
                (/\S+/.test($('input[name="serial"]').val())));
      }

      $().ready(function(){
        $('#generator_form')
          .submit(validate)
          .find('input[type="text"]')
            .keypress(function(evt) {
              if (evt.which == 13) { // ENTER pressed
                var next_elem;
                if (evt.target.name == 'invoice') { next_elem = $('input[name="model"]'); }
                else if (evt.target.name == 'model') { next_elem = $('input[name="serial"]'); }
                else if (evt.target.name == 'serial') { return validate(); }
                $(next_elem).focus();
                return false;
              } else { // some other key pressed
                return true;
              }
            })
          .end();
      });
    </script>
  </head>
  <body>
    <fieldset style="width: 300px;">
      <form id="generator_form" action="generator.php" method="post">
        Invoice Number:<input type="text" name="invoice" /><br />
        Model Number:<input type="text" name="model" /><br />
        Serial Number:<input type="text" name="serial" /><br />
        <input type="hidden" name="reload" value="true" />
        <input type="submit" />
      </form>
      <br />
      <a href=null>en espanol</a>
    </fieldset>
  </body>
</html>

更新：在'serial'字段中提交[ENTER]。

更新：在所有情况下都要正确验证。

更改表单提交（输入到选项卡）

1 个答案: