【问题标题】:How to check if the any of my textbox is empty or not in javascript [duplicate]如何在javascript中检查我的任何文本框是否为空[重复]
【发布时间】:2012-09-08 09:00:37
【问题描述】:

可能重复:
Check if inputs are empty using jQuery

我有表单和文本框,一旦单击表单按钮,我将如何使用 javascript if else 语句确定这些文本框是否为空。

function checking() {
    var textBox = $('input:text').value;
    if (textBox == "") {
        $("#error").show('slow');
    }
}

提前致谢!

【问题讨论】:

标签: javascript jquery


【解决方案1】:

通过使用 jQuery 选择器来选择元素,你有一个 jQuery 对象,你应该使用val() 方法来获取/设置输入元素的值。

还请注意,:text 选择器已弃用,最好修剪文本以删除空白字符。您可以使用$.trim 实用功能。

function checking() {
    var textBox =  $.trim( $('input[type=text]').val() )
    if (textBox == "") {
        $("#error").show('slow');
    }
}

如果您想使用value 属性,您应该首先将jQuery 对象转换为原始DOM 对象。您可以使用[index]get 方法。

 var textBox = $('input[type=text]')[0].value;

如果你有多个输入,你应该遍历它们。

function checking() {
    var empty = 0;
    $('input[type=text]').each(function(){
       if (this.value == "") {
           empty++;
           $("#error").show('slow');
       } 
    })
   alert(empty + ' empty input(s)')
}

【讨论】:

  • 嗨!这也不起作用。我有 6 个文本框,其中两个文本框确实有值,它会影响条件吗?我试图做的是一旦用户单击提交按钮并且任何剩余的文本框都是空的,就会显示错误警告。谢谢。
  • @ray 嗨,试试更新的代码。
  • 嗨!不好,我想我不必循环播放。实际上我有很长的解决方案 --> function checking() { if(document.getElementById("entry_0").value == "") { $("#error").show('slow'); } if(document.getElementById("entry_1").value == "") { $("#error").show('slow'); } } 想象一下,如果我有 20 个文本框。这就是为什么我试图调用 input:text 对象本身或“表单输入”以仅在一个函数中调用所有文本框。谢谢!
  • 嗨@undefined!非常感谢!它确实有效,尝试了您的更新!非常感谢!
【解决方案2】:

您不能将value 与jquery 对象一起使用val() 函数,但这只会检查选择器返回的第一个文本框。

Live Demo

function checking() {    
  var textBox = $('input:text').val();
  if (textBox == "") {
      $("#error").show('slow');
   }
}

您可以附加blur 事件并在losing focus from each textbox. 上进行此验证

Live Demo

$('input:text').blur(function() {    
    var textBox = $('input:text').val();
    if (textBox == "") {
        $("#error").show('slow');
    }
});

根据与 OP 的讨论验证submit button 点击

Live Demo

$('#btnSubmit').click(function() { 
     $("#error").hide();    
     $('input:text').each(function(){
       if( $(this).val().length == 0)
          $("#error").show('slow');
    });
});

【讨论】:

  • 感谢您的及时回复,其实我也试过了,但效果不佳。我有 6 个文本框,其中两个文本框确实有值,它会影响条件吗?我想要做的是,一旦用户单击提交按钮并且任何剩余的文本框为空,就会显示错误警告。
  • 更新我的答案,我希望它能帮助你做你想做的事。
  • @Adil 这是一个出色且内容丰富的答案。 +1。
【解决方案3】:

试试这个代码:

var textBox = $('input:text').val();

if (textBox==""){ 
  $("#error").show('slow'); 
} 

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2022-01-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多