2015-05-05 2 views
2

Я работаю над базовой системой подсчета очков. У меня есть текстовые поля и вы хотите, чтобы пользователь только вводил числа в определенном наборе, и если число, находящееся за пределами набора, вводится, возникает ошибка, говорящая «только эти цифры могут быть введены». Однако есть несколько наборов чисел. Возможно ли иметь более одного? Вот мой код:Есть ли способ, которым я могу иметь несколько ограничений числа в разных текстовых блоках?

<!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

Есть текстовые поля рядом с косой чертой и номер

+0

вы могли бы привести пример одного или двух входов и какие наборы чисел справедливы? –

+0

танца Количество: Судья 1 Комментарии Техник:/35 Хореография/15 Производительность:/25 Точность:/15 Всего баллы:/90 – retrogirl19

+0

я рекомендую вам теперь смотрите при автоматизации итогов в javascript - вы можете задать вопрос об этом в следующий раз или выполнить поиск в Интернете. –

ответ

1

Я хотел бы использовать номер типа входного сигнала (как это баллы) и установить максимальное и минимальное значение, которое будет применяться в браузере.

HTML

<!DOCTYPE html> 
<html> 
<body> 
<p align="right"> Dance Number: <input type="number"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="number" min="0" max="35"> /35</p> 
<p> Choreography: <input type="number" min="0" max="15"> /15</p> 
<p> Performance: <input type="number" min="0" max="25"> /25</p> 
<p> Precision: <input type="number" min="0" max="15"> /15</p> 
<p> Total Points: <input type="number" min="0" max="90"> /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="number" min="0" max="35"> /35</p> 
<p> Choreography: <input type="number" min="0" max="15"> /15</p> 
<p> Performance: <input type="number" min="0" max="25"> /25</p> 
<p> Precision: <input type="number" min="0" max="15"> /15</p> 
<p> Total Points: <input type="number" min="0" max="90"> /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="number" min="0" max="35"> /35</p> 
<p> Choreography: <input type="number" min="0" max="15"> /15</p> 
<p> Performance: <input type="number" min="0" max="25"> /25</p> 
<p> Precision: <input type="number" min="0" max="15"> /15</p> 
<p> Total Points: <input type="number" min="0" max="90"> /90</p> 
<p> Over All Score: <input type="number" min="0" max="90"> /90</p> 
<p> Award Assigned:</p> 
<input type="submit" /> 
</form> 
<script> 

</script> 
</body> 
</html> 
+1

, что HTML5 :) приходит на помощь :) Я не знал, что тип ввода может быть числом. –

1

Simply вы можете, я не знаю, можете ли вы использовать css, но используя javascript, который вы можете использовать, нажав клавишу. Как следующее:

<!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> 
+0

Большое спасибо! – retrogirl19

+0

Извините, мой предыдущий код не работал, я набрал его все на ячейку и, кроме того, скопировал другой код. Обратите внимание, что теперь переменные находятся вне функции, это поможет их увеличить;), и мы полностью отключим вход, вместо того, чтобы использовать сокращение строк. –

Смежные вопросы