Question

为什么在以下情况下无法进行数字验证。

我尝试过检查值的类型

if(typeof value!=='number'){}

我尝试检查value是否小于1。默认情况下，变量的值为0

if(parseInt(value)<1){}

以下代码段运行正常，现在我想添加其他要求，检查用户是否输入了号码，如果检测到文本，则停止进一步处理警报号码。

它正在检查null值，可以使用null值正常工作，但是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>

Answer 1

value始终是字符串，检查字符串是否可转换为数字的最佳方法是window.isNaN函数（否与{{1 }}）：

Number.isNaN

如果您希望将if(window.isNaN(value)) { /* act accordingly, the value is not a number */ }字符串转换为数字，只需使用value构造函数

Number

Answer 2

如 @Jaromanda X 所述，输入值始终是字符串，因此您需要使用parseInt将其转换为整数，并使用isNaN()检查是否{{ 1}}不是数字：

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);
        }

    }
}

为什么typeof或数字检查验证返回false

2 个答案: