Question

这是我第二天的编码，所以如果我不知道如何正确解释或基本解决方法，请原谅我。

我正在尝试在网站上复制控制台界面，并且我希望输入框仅在得到特定输入的情况下才重定向到特定链接。我还希望它根本不重定向，并且在给出无效提示时给出一条消息。到目前为止，我输入框的代码是

  <form action="backlog">
    <label for="fname">     
    <input type="text" name="logsarchives" id="logsarchives" autocomplete="off"  placeholder="Enter Console Command">
    </form>

可以查看here到目前为止的代码，也可以here查看网站。谢谢您阅读！

Answer 1

您可以使用javascript函数提交表单，获取表单中输入的值，然后检查其是否匹配！

HTML：

<form action="backlog" onsubmit="myFormSubmit()">
  <input type="text" id="logsarchives" />
</form>

Javascript：

function myFormSubmit(event) {
  event.preventDefault();

  const myInput = document.getElementById('logsarchives');

  if (myInput.value == 'something') {
    window.location = 'http://google.com'
  }
}

您可能要删除表单的action属性，这会使您的提交自动重定向。另外，仅当您提交表单（通过按按钮或在键盘上输入）时才起作用，如果您希望它自动工作，则可能正在搜索输入元素的onChange方法。

这是一支您可以玩耍的笔！：） https://codepen.io/pedrost/pen/RBLOgY

Answer 2

添加javascript：

<script>
document.getElementById("logsarchives").addEventListener("keydown", function() {
    var valid-options = ["option1", "option2", "soforth"];
    var input = document.getElementById("logsarchives").value;
    for (var i = 0; i < valid-options.length, i++) {
        if(input === valid-options[i]) { /*or ==*/
            window.location.replace("/backlog?logsarcives=" + valid-options[i]);
            return;
        }
    }
});
</script>

Answer 3

因此，您需要一些JavaScript来处理这种情况。同样，在没有适当的关闭目的甚至关闭标签的情况下，仅使用了不必要数量的标签

<!DOCTYPE html>
<html> 
    <body>
        <input type="text" name="logsarchives" id="logsarchives" autocomplete="off"  placeholder="Enter Console Command" onkeydown="redirect(this)">
    </body>
    <script>
        function redirect(ele) {
            if(event.key === 'Enter') {
                if(ele.value === 'google')
                     window.location.href = 'https://google.com';
                else
                    alert("Invalid");
            }
        }
    </script>
</html>

给定特定输入时如何重定向到特定页面

3 个答案: