将输入字段限制为仅数字
[英]limiting input field to numbers only
问题描述
我正在为学校编写程序，他希望我们执行以下操作：如果在“年龄”字段中输入了任何非数字条目，则将出现带有两行消息的警告框：
您输入的年龄只能包含数字。 请重新输入。
然后：如果输入的年龄小于18岁，则在包含消息的按钮下方应显示一个附加段落
然后：对于18岁及以上的年龄，脚本必须根据申请人的大学学历计算并显示薪水。 如果申请人持有学位，则通过将申请人的年龄乘以$ 1000.00来确定薪水。 没有学位，乘数将仅为$ 600.00。 按下“确定薪水”按钮时，脚本将显示包含计算出的薪水报价的额外段落元素，如以下示例图中所示。
我已经尝试了所有可能想到的方法，以确保没有在年龄字段中输入任何字母字符，但是我似乎无法使其正常工作。 请帮忙！
<?xml version='1.0' encoding='utf-8'?>
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN'
'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en'>
<head>
<meta http-equiv='Content-Type' content='text/html; charset= utf-8' />
<title>Form Based JavaScript</title>
<style type = "text/css">
h2 {text-align:left;}
body {background-color:lightblue;}
.input {font-family:"Courier New", Courier, monospace;}
</style>
<script type = "text/javascript">
<!--
function salary() `enter code here`
{
var age;
var degree;
if (age != [0-99]
{
document.writeln( "The age that you entered must contain only numerals. <br /> Please re-enter it.");
else if (age < 18)
document.writeln( " Sorry - you must be 18 or older for this job. <br /> Please reapply in [18 - age] years." );
else if (age >=18)
document.writeln( " You qualify! Salary offer [degree * ] dollars. See our staff for an application" );
}
}
// -->
</script>
<!-- project6.htm Tatiana Saavedra 04/17/2013 -->
</head>
<body>
<h2> Applicant Screening Page </h2>
<hr />
<form id = "myForm" action = "">
<p>Email:<input type = "email" id = "email"></p>
<p>Age:<input type = "number" maxlength="3" size="3" id = "age"></p>
<p><label>Check the box if you hold a college degree: <input type = "checkbox" id = "degree"></label></p>
<br />
<form action="">
<input type="button" value="Determine Salary" onclick="salary()"/>
</form>
</body>
</html>
3 个解决方案
解决方案1
0 2013-04-23 23:32:11
您在打开和关闭方括号时遇到一些错误，请在执行任何操作之前检查此错误，您的JavaScript尚未加载，因此不执行任何操作，正如已经告诉您的那样，您在声明变量但未为其分配值。 我也建议您将javascript放在页面底部
解决方案2
0 2013-04-23 23:39:34
尝试这个 ：
function isInteger(n)
{
if (n.indexOf('.') != -1)
{
return false;//do not accept decimal numbers
}
return !isNaN(parseInt(n)) && isFinite(n);
}
parseInt将值解析为整数，如果值包含字母字符，则返回NaN
isNaN检查结果是否为NaN
isFinite处理n以数字开头但包含字符的情况。
您不只使用isFinite的原因是，如果尝试使用isFinite(' ')它将返回true。
还可以使用parseInt(age)值进行比较，因为比较数字更好
解决方案3
0 2013-04-24 01:23:13
<?xml version='1.0' encoding='utf-8'?>
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN'
'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en'>
那是一个非常老的DOCTYPE，不应该使用（它是十多年来帮助从HTML到XHTML的过渡，但从未发生过）。 只需使用：
<?DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset= utf-8' />
看到？ 内容是HTML，用作HTML。 :-) [...]
如果这是XML，则只需将页面空白。 HTML注释定界符已经有20多年的历史了，在符合HTML标准的浏览器中，脚本头部的脚本元素从不需要它们。 不要使用它们。
function salary() `enter code here`
{
糟糕，您不能在其中输入字符串文字。 将其放在功能主体中。 我喜欢将左括号与function关键字和名称放在同一行。 我假设字符串根本不存在：
function salary() {
var age;
var degree;
if (age != [0-99]
缺少右括号“）”。
{
document.writeln( "The age that you entered must contain only numerals. <br /> Please re-enter it.");
如果调用document.writeln的文档finsihed加载后，它会先调用document.open ，这
清除文档中的所有内容。 您可能想要做的是在文档中添加一个元素，并将文本放入其中。 或将文本放在页面中已有的元素内。
else if (age < 18)
您应该在所有if块周围使用花括号，这样会使代码更易于阅读。 有时，为非常简单的块和语句省略它们很方便，但此处不行。 小号
document.writeln( " Sorry - you must be 18 or older for this job. <br /> Please reapply in [18 - age] years." );
您似乎正在尝试在字符串中进行算术运算，但是您不能这样做。 因此，通过写入元素来替换document.writeln ，并进行如下简化：
"Please reapply in " + (18 - age) + " years."
。
else if (age >=18)
document.writeln( " You qualify! Salary offer [degree * ] dollars. See our staff for an application" );
}
}
同样在这里。
</script>
</head>
<body>
<h2> Applicant Screening Page </h2>
<hr>
<form id = "myForm" action = "">
<p>Email:<input type = "email" id = "email"></p>
<p>Age:<input type = "number" maxlength="3" size="3" id = "age"></p>
您可以在输入年龄之前输入一个空的跨度以放入消息。
<p><label>Check the box if you hold a college degree: <input type = "checkbox" id = "degree"></label></p>
表单控件需要一个名称才能成功，它们通常不需要ID。
<p>Email:<input type="email" name="email"></p>
<p>Age:<input type ="number" maxlength="3" size="3" name="age"></p>
<p><label>Check the box if you hold a college degree: <input type="checkbox" name="degree"></label></p>
<br>
<form action="">
您不能将表单放入表单中，只需删除上面的标签（它没有结束标签）。
<input type="button" value="Determine Salary" onclick="salary()">
您需要一个提交按钮来使表单提交。
</form>
</body>
</html>
因此，请尝试更新代码，如果需要更多帮助，请回来。
限制输入字段只接受带范围的数字
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.