如何检查我是不是在javascript中提交空白输入？我写了一个程序，但它不工作

Posted 2023-02-21

【中文标题】如何检查我是不是在javascript中提交空白输入？我写了一个程序，但它不工作

【英文标题】：How to check whether i submit blank input in javascript? i have written a program but it is not working如何检查我是否在javascript中提交空白输入？我写了一个程序，但它不工作

【发布时间】：2021-12-30 19:52:39

【问题描述】：

我使用脚本标记在 html 文件中编写了 javascript 代码， 我想知道我的输入是大于还是小于 10 或等于 10 或任何空白输入。我用if-else方法解决 这个问题，但我的最后一个条件是“你的输入是 空白”不以任何方式输出。

//f1 function will run when some hit the submit button
function f1() 
  //here we are taking the value of the input field using id "myinput" in the variable called myinputvar
  var myinputvar = document.getElementById("myinput").value;
  if (myinputvar > 10) 
    document.getElementById("txt").innerHTML = "Your input number is greater than 10";
   else if (myinputvar < 10) 
    document.getElementById("txt").innerHTML = "Your input number is less than 10";
   else if (myinputvar = 10) 
    document.getElementById("txt").innerHTML = "Your input number is 10";
   else if (myinputvar = " ") 
    document.getElementById("txt").innerHTML = "Your input is blank";
  

<!-- this is the input tag to take inputs from user -->
Enter a integer number between 0 to anynumber = <input type="text" id="myinput"><br><br>
<!-- this is the button to submit the value -->
<button onclick="f1()">submit</button>
<!-- this is the heading tag to print the output -->
<h1 id="txt"></h1>

【参考方案1】：

包装成表格并使其成为必需

也转换为数字

document.getElementById("myForm").addEventListener("submit", function(e) 
  e.preventDefault(); // stop submission
  //here we are taking the value of the input field using id "myinput" in the variable called myinputvar
  var myinputvar = +document.getElementById("myinput").value; // make it a number
  if (myinputvar > 10) 
    document.getElementById("txt").innerHTML = "Your input number is greater than 10";
   else if (myinputvar < 10) 
    document.getElementById("txt").innerHTML = "Your input number is less than 10";
   else if (myinputvar = 10) 
    document.getElementById("txt").innerHTML = "Your input number is 10";
   else if (myinputvar = " ") 
    document.getElementById("txt").innerHTML = "Your input is blank";
  
)

<form id="myForm">
  Enter a integer number between 0 to anynumber =
  <input type="text" required id="myinput"><br><br>
  <button>submit</button>
</form>
<h1 id="txt"></h1>

【讨论】：

谢谢。这对我来说是一个棘手的方法，但它也有效。我想避免 javascript 的内置功能并使其非常简单。感谢您的回复。

必需的根本不是js

【参考方案2】：

仅检查空格输入的一般方法是使用正则表达式模式^\s*$。示例代码：

if (/^\s*$/.test(inputvar)) 
    document.getElementById("txt").innerHTML = "Your input is blank";

【讨论】：

谢谢。它实际上有效，但在嵌套的 if-else 中。

【参考方案3】：

注意不要使用快捷方式：

if (inputvar) 
    // this won't catch "0"!

但更合适

if (inputvar === "") 
    // is empty

当然，如果您想将数字作为输入处理，您应该首先检查这种情况。

【参考方案4】：

您可以使用 ASCII 码来检查

else if(myinputvar.carCodeAt(0) === 13) 
    document.getElementById("txt").innerHTML = "Your input is blank";

13 是回车键的 ASCII 码 https://www.asciitable.com/

【参考方案5】：

> This method is also working, the logic is i should have use a nested
> if like this

 
function f1() 
            var myinputvar = document.getElementById("myinput").value;
            if (myinputvar == "") 
                document.getElementById("txt").innerHTML = "Your input is blank";
             else 
                if (myinputvar > 10) 
                    document.getElementById("txt").innerHTML = "Your input number is greater than 10";
                 else if (myinputvar < 10) 
                    document.getElementById("txt").innerHTML = "Your input number is less than 10";
                 else if (myinputvar = 10) 
                    document.getElementById("txt").innerHTML = "Your input number is 10";
                
            

        

【讨论】：

正如目前所写，您的答案尚不清楚。请edit 添加其他详细信息，以帮助其他人了解这如何解决所提出的问题。你可以找到更多关于如何写好答案的信息in the help center。

【参考方案6】：

正如蒂姆·比格莱森所说，它是这样工作的：

var myinputvar = document.getElementById("myinput").value;
if (/^\s*$/.test(myinputvar)) 
   document.getElementById("txt").innerHTML = "Your input is blank";
 else 
  if (myinputvar > 10) 
     document.getElementById("txt").innerHTML = "Your input number is greater than 10";
   else if (myinputvar < 10) 
    document.getElementById("txt").innerHTML = "Your input number is less than 10";
   else if (myinputvar = 10) 
    document.getElementById("txt").innerHTML = "Your input number is 10";
  

【参考方案7】：

检查给定的输入值是否为有效数字

    function isNumber(n) return /^-?[\d.]+(?:e-?\d+)?$/.test(n);