有没有办法我可以在不同的文本框上有多个数字限制?

时间:2015-05-05 22:06:04

标签: html

我正在研究一个基本的得分单位。我有文本框,希望用户只能在特定的集合中输入数字,如果输入了集合之外的数字,则会出现“只能输入这些数字”的错误。但是有多组数字。是否有可能有多个?这是我的代码:

<!DOCTYPE html>
<html>
<body>
<p align="right"> Dance Number:  <input type="text"size="3"></p>
<h1><ins>Judge 1</ins></h1>
<p> Comments</p>
<textarea name="myTextBox" cols="50" rows="5">
</textarea>
<br />
<form>
<p> Technique:  <input type="text"size="3"> /35</p>
<p> Choreography:  <input type="text"size="3"> /15</p>
<p> Performance: <input type="text"size="3"> /25</p>
<p> Precision:  <input type="text"size="3"> /15</p>
<p> Total Points: <input type="text"size="3">  /90</p>
<h1><ins>Judge 2</ins></h1>
<p> Comments</p>
<textarea name="myTextBox" cols="50" rows="5">
</textarea>
<br />
</form>
<form>
<p> Technique:  <input type="text"size="3"> /35</p>
<p> Choreography:  <input type="text"size="3"> /15</p>
<p> Performance: <input type="text"size="3"> /25</p>
<p> Precision:  <input type="text"size="3"> /15</p>
<p> Total Points:  <input type="text"size="3"> /90</p>
<h1><ins>Judge 3</ins></h1>
<p> Comments</p>
<textarea name="myTextBox" cols="50" rows="5">
</textarea>
<br />
</form>
<form>
<p> Technique:  <input type="text"size="3"> /35</p>
<p> Choreography:  <input type="text"size="3"> /15</p>
<p> Performance: <input type="text"size="3"> /25</p>
<p> Precision:  <input type="text"size="3"> /15</p>
<p> Total Points:   <input type="text"size="3"> /90</p>
<p> Over All Score:<input type="text"size="3"> /90</p>
<p> Award Assigned:</p>
<input type="submit" />
</form>
<script>
</script>
</body>
</html>

技术:/ 35 编排:/ 15 表现:/ 25 精度:/ 15

斜杠旁边有文本框和数字

2 个答案:

答案 0 :(得分:1)

只是你可以,我不知道你是否可以使用CSS,但你可以使用按键,按下键。如下:

<!DOCTYPE html >
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>insert page</title></head>
<body onkeypress="alert("HELL")">
    <textarea id='textbox1' onkeypress="countLetters(this, 15)">
    </textarea>

    <textarea id='textbox2' onkeypress="countLetters(this, 25)"></textarea>

<script type='text/javascript'>
    var textbox1 = textbox2 = textbox3 = textbox4 = 0;

function countLetters(element, limit) {

    if(element.id == 'textbox1') {
        if(element.value.length > limit) {
            element.disabled=true;
        } else {
            textbox1++;
        }
   } else if (element.id == 'textbox2') {
       if(element.value.length > limit) {
            element.disabled=true;
       } else {
           textbox2++;
       }
   }
}
</script>

</body>
</html>

答案 1 :(得分:1)

我会使用输入类型编号(因为这些是分数)并设置将由浏览器强制执行的最大值和最小值。

<强> HTML

event