Почему проверка номера не работает в следующем случае.
Я пытался с проверкой типа значения
if (typeof value!=='number'){}
Я попытался проверить, меньше ли значение 1. Значение переменной по умолчанию равно 0.
if (parseInt(value)<1){}
Следующий фрагмент работает нормально, теперь я хочу добавить дополнительное требование, проверить, ввел ли пользователь номер или нет, и остановить дальнейший процесс оповещения, если текст был обнаружен.
Он проверяет нулевое значение, отлично работает с нулевым значением, но что не так с typeof
и less than 1
.
Я добавил блок кода в качестве комментария, который не работает.
Первая проверка из блока комментариев — это возврат false, даже если мы вводим число в поле.
Вторая валидация из блока комментариев частично работает, но она должна выдавать сообщение и прерывать процесс, но дает NaN
результат.
window.onload=function(){
bk_issue();
}
function bk_issue(){
document.getElementById('btn_iss').onclick=function(){
if (document.querySelectorAll('input[name = "book"]:checked').length===0){
alert('Please check at least one book');
return false;
}
if (document.querySelectorAll('input[name = "std"]:checked').length===0){
alert('Please check at least one student or staff');
return false;
}
else{
var ttl_qnt = document.querySelector('input[name = "book"]:checked').getAttribute('data-id');
var std = document.querySelectorAll('input[name = "std"]:checked');
var iss_qnt=0;
for (var i=0;i<std.length;i++){
var value = std[i].closest('tr').getElementsByTagName('td')[2].querySelector('.qnt').value;
if (value===''){
var std_qnt = 0;
alert('Please fill book quantity in checked student field');
return false;
}
// This validation is not working
/* if (typeof value!=='number'){
var std_qnt = 0;
alert('Please type number only');
return false;
}
if (parseInt(value)<1){
var std_qnt = 0;
alert('Please type number only');
return false;
}*/
else{
var std_qnt = std[i].closest('tr').getElementsByTagName('td')[2].querySelector('.qnt').value;
}
iss_qnt += parseInt(std_qnt);
}
alert(iss_qnt);
}
}
}
<html>
<head>
</head>
<body>
<table>
<tr>
<th>Select</th><th>Book</th><th>Qnt</th>
</tr>
<tr>
<td><input type='radio' name='book' value='1' data-id='20' /></td><td>Social Experiment</td><td>20</td>
</tr>
<tr>
<td><input type='radio' name='book' value='1' data-id='12' /></td><td>Evolution of group</td><td>20</td>
</tr>
</table>
<br/>
<button id='btn_iss'>Issue</button>
<br/>
<table>
<tr>
<th>Select</th><th>Name</th><th>Issued Qnt</th>
</tr>
<tr>
<td><input type='checkbox' value='1' name='std' /></td><td>Rahul</td><td><input type='text' value='' class='qnt'></td>
</tr>
<tr>
<td><input type='checkbox' value='2' name='std' /></td><td>Preeti</td><td><input type='text' value='' class='qnt'></td>
</tr>
<tr>
<td><input type='checkbox' value='3' name='std' /></td><td>Prince</td><td><input type='text' value='' class='qnt'></td>
</tr>
</table>
</body>
</html>
@JaromandaX, поэтому я добавил проверку, но почему она игнорируется.
я использую свойство constructor
в эти дни. Я не уверен, лучше это или нет, хотя. Я использую его, чтобы получить немного больше глупости вместо сравнения строковых значений с typeof, я обычно говорю value.constructor == (1).constructor
@Hemant - ваша проверка не работает, потому что первое, что вы проверяете, это пустая строка, если да, то она недействительна (пока все хорошо), следующее (прокомментированное как не работающее) вы проверяете, это число, если нет, то это недействительно ... и, как я сказал в своем комментарии, входное значение - это всегда строка, поэтому ваш код считает любой ввод недействительным
value
всегда будет строкой, лучший способ проверить, можно ли преобразовать строку в число, — это функция window.isNaN
(НЕТ следует путать с Number.isNaN
):
if (window.isNaN(value)) {
/* act accordingly, the value is not a number */
}
Если вы хотите преобразовать эту строку value
в число, просто используйте конструктор Number
value = Number(value)
Как указано в @Яроманда Х, входное значение всегда является строкой, поэтому вам нужно преобразовать его в целое число с помощью parseInt
и использовать isNaN()
, чтобы проверить, не является ли parseInt(value)
числом:
if (isNaN(parseInt(value))){
var std_qnt = 0;
alert('Please type number only');
return false;
}
window.onload=function(){
bk_issue();
}
function bk_issue(){
document.getElementById('btn_iss').onclick=function(){
if (document.querySelectorAll('input[name = "book"]:checked').length===0){
alert('Please check at least one book');
return false;
}
if (document.querySelectorAll('input[name = "std"]:checked').length===0){
alert('Please check at least one student or staff');
return false;
}
else{
var ttl_qnt = document.querySelector('input[name = "book"]:checked').getAttribute('data-id');
var std = document.querySelectorAll('input[name = "std"]:checked');
var iss_qnt=0;
for (var i=0;i<std.length;i++){
var value = std[i].closest('tr').getElementsByTagName('td')[2].querySelector('.qnt').value;
if (value===''){
var std_qnt = 0;
alert('Please fill book quantity in checked student field');
return false;
}
if (isNaN(parseInt(value))){
var std_qnt = 0;
alert('Please type number only');
return false;
}
else{
var std_qnt = std[i].closest('tr').getElementsByTagName('td')[2].querySelector('.qnt').value;
}
iss_qnt += parseInt(std_qnt);
}
alert(iss_qnt);
}
}
}
<html>
<head>
</head>
<body>
<table>
<tr>
<th>Select</th><th>Book</th><th>Qnt</th>
</tr>
<tr>
<td><input type='radio' name='book' value='1' data-id='20' /></td><td>Social Experiment</td><td>20</td>
</tr>
<tr>
<td><input type='radio' name='book' value='1' data-id='12' /></td><td>Evolution of group</td><td>20</td>
</tr>
</table>
<br/>
<button id='btn_iss'>Issue</button>
<br/>
<table>
<tr>
<th>Select</th><th>Name</th><th>Issued Qnt</th>
</tr>
<tr>
<td><input type='checkbox' value='1' name='std' /></td><td>Rahul</td><td><input type='text' value='' class='qnt'></td>
</tr>
<tr>
<td><input type='checkbox' value='2' name='std' /></td><td>Preeti</td><td><input type='text' value='' class='qnt'></td>
</tr>
<tr>
<td><input type='checkbox' value='3' name='std' /></td><td>Prince</td><td><input type='text' value='' class='qnt'></td>
</tr>
</table>
</body>
</html>
входное значение всегда строка