如何检查是否屏蔽输入字段为空

Question

我用这masked input plugin，我想检查时，该字段为空。下面是我试过，但它似乎并没有工作：

HTML

<input type="text" name="phone" id="phoneid" /> 

乐的JavaScript：

$("#phoneid").mask("999-999-9999"); 

此代码不能正常工作

  $("#phoneid").keyup(function(){ 
       if($("#phoneid").val().length == 0){ 
        alert(111); 
       } 
      }); 

Answer 1

掩蔽您使用的插件会更改input元素的值。

当元素是空的，它具有的___-___-____的值。

检查值的长度时，您可以简单地剥离出_/-字符：

$("#phoneid").on('keyup', function() { 
    if (this.value.replace(/[_-]/g, '').length === 0) { 
    alert('Empty'); 
    } 
}); 

或者，您也可以检查是否值只包含_/-字符：

$("#phoneid").on('keyup', function() { 
    if (/^[_-]+$/.test(this.value)) { 
    alert('Empty'); 
    } 
}); 

Answer 2

我们可以通过再次用“9999999999”来掩盖它，即没有破折号然后比较如下：

$(document).ready(function(){ 
 
    $("#phoneid").mask("999-999-9999"); 
 
    
 
    $("#phoneid").keyup(function(){ 
 
    if($("#phoneid").mask("9999999999").val().length == 0){ 
 
     alert(111); 
 
    } 
 
    $("#phoneid").mask("999-999-9999"); 
 
    }); 
 
    
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 

 
<script src="https://raw.githubusercontent.com/digitalBush/jquery.maskedinput/1.4.1/dist/jquery.maskedinput.min.js"></script> 
 

 
<input type="text" name="phone" id="phoneid" /> 
 
<button id="test">Test</button>

Answer 3

我简单的解决方案。此代码是用于检查所有输入接口，包括蒙面： inputs.val（）== “”

.on('blur', '.form__input', function(e) { 
    var inputs = $(this).find('input,textarea,select'); 
    setTimeout(function(){ 
     if (inputs.val().length == 0 || inputs.val() == ""){ 
      alert('Empty'); 
     } 
    },100); 
});