输入文本后如何自动加载新页面

Question

我正在设置一个信息亭，人们将走到那里，并扫描包含8个字符的确认码的QR码。

在他们扫描其QR码并将其确认号填充到文本字段后，我想自动重定向到另一页。 有没有可以用来实现此目的的JavaScript函数？

我不希望他们必须单击“提交”按钮或执行任何操作。

<form action="post.php" method="post" accept-charset="utf-8">
        <input type="text" name="confirm" id="scanner" autofocus="autofocus" value="" maxlength="8">
</form>

Answer 1

 var scanner = document.getElementById('scanner'); function checkLength(){ if(scanner.value.length === 8){ window.location.assign('http://stackoverflow.com') } }

 <input type="text" name="confirm" id="scanner" autofocus="autofocus" value="" maxlength="8" oninput="checkLength()">

Answer 2

这是我会做的：

<html>
    <body>


        <form action="post.php" method="post" accept-charset="utf-8">
            <input type="text" name="confirm" id="scanner" autofocus="autofocus" value="" maxlength="8">
        </form>


        <script>
            $("#scanner").submit(function(e) {
                e.preventDefault();
                window.location.href = "http://www.google.com";
            });
        </script>


   </body>
</html>

这是假设您正在使用JQuery

Answer 3

您只需要使用onchange事件：
HTML：

<form action="post.php" method="post" accept-charset="utf-8">
        <input type="text" name="confirm" id="scanner" autofocus="autofocus" value="" maxlength="8" onchange="newPage();">
</form>

JavaScript的：

function newPage(){
windows.location.href = www.yourlinkhere.com;
}

Answer 4

 $(document).ready(function(){ $(document).bind('input propertychange','#scanner',function(e){ e.preventDefault(); window.location.assign('http://stackoverflow.com'); }); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form action="post.php" method="post" accept-charset="utf-8" id="form_submit"> <input type="text" name="confirm" id="scanner" autofocus="autofocus" value="" maxlength="8"> </form>

输入文本后如何自动加载新页面

问题描述

4 个解决方案

解决方案1
2 已采纳 2015-08-07 03:22:01

解决方案2
0 2015-08-07 03:07:06

解决方案3
0 2015-08-07 03:10:46

解决方案4
0 2015-08-07 05:15:44

输入文本后如何自动加载新页面

问题描述

4 个解决方案

解决方案1 2 已采纳 2015-08-07 03:22:01

解决方案2 0 2015-08-07 03:07:06

解决方案3 0 2015-08-07 03:10:46

解决方案4 0 2015-08-07 05:15:44

解决方案1
2 已采纳 2015-08-07 03:22:01

解决方案2
0 2015-08-07 03:07:06

解决方案3
0 2015-08-07 03:10:46

解决方案4
0 2015-08-07 05:15:44