如何检查我是否在 javascript 中提交了空白输入?我写了一个程序,但它不工作
How to check whether i submit blank input in javascript? i have written a program but it is not working
我使用脚本标签在 HTML 文件中编写了 javascript 代码,
我想知道我的输入是大于还是小于 10
或等于 10 或任何空白输入。我用if-else方法解决
这个问题,但我的最后一个 else if 条件是“你的输入是
空白”不以任何方式输出。
//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>
仅检查空格输入的通用方法是使用正则表达式模式 ^\s*$
。示例代码:
if (/^\s*$/.test(inputvar)) {
document.getElementById("txt").innerHTML = "Your input is blank";
}
包装在表格中并使其成为必需的
也转换为数字
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>
注意不要使用快捷方式:
if (inputvar) {
// this won't catch "0"!
}
不过更合适
if (inputvar === "") {
// is empty
}
当然,如果您想将数字作为输入处理,您应该首先检查此条件。
检查给定的输入值是否为有效数字
function isNumber(n){ return /^-?[\d.]+(?:e-?\d+)?$/.test(n); }
正如 Tim Biegeleisen 提到的,它是这样工作的:
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";
}
}
您可以使用 ASCII 码来检查
else if(myinputvar.carCodeAt(0) === 13) {
document.getElementById("txt").innerHTML = "Your input is blank";
}
13为回车键的ASCII码
https://www.asciitable.com/
> 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";
}
}
}
我使用脚本标签在 HTML 文件中编写了 javascript 代码, 我想知道我的输入是大于还是小于 10 或等于 10 或任何空白输入。我用if-else方法解决 这个问题,但我的最后一个 else if 条件是“你的输入是 空白”不以任何方式输出。
//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>
仅检查空格输入的通用方法是使用正则表达式模式 ^\s*$
。示例代码:
if (/^\s*$/.test(inputvar)) {
document.getElementById("txt").innerHTML = "Your input is blank";
}
包装在表格中并使其成为必需的
也转换为数字
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>
注意不要使用快捷方式:
if (inputvar) {
// this won't catch "0"!
}
不过更合适
if (inputvar === "") {
// is empty
}
当然,如果您想将数字作为输入处理,您应该首先检查此条件。
检查给定的输入值是否为有效数字
function isNumber(n){ return /^-?[\d.]+(?:e-?\d+)?$/.test(n); }
正如 Tim Biegeleisen 提到的,它是这样工作的:
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";
}
}
您可以使用 ASCII 码来检查
else if(myinputvar.carCodeAt(0) === 13) {
document.getElementById("txt").innerHTML = "Your input is blank";
}
13为回车键的ASCII码 https://www.asciitable.com/
> 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";
}
}
}