【问题标题】:jQuery check if any text input has valuejQuery 检查任何文本输入是否有值
【发布时间】:2014-03-10 07:13:43
【问题描述】:

我想问一下 jQuery 中是否有更好的方法来选择多个文本输入,然后检查它们中的任何一个是否有值。这是我的代码:

if ($("#reference").val() != "" || $("#pin").val() != "" || $("#fName").val() != "" || $("#mName").val() != "" || $("#datepicker").val() != "") { /*logic goes here */ }

【问题讨论】:

  • @Priyajain,为了什么?
  • @Priyajain OP 想要检查是否至少一个输入有一个值,而不是如果它们全部为空。请不要误导他。

标签: javascript jquery jquery-selectors


【解决方案1】:

你可以这样做:

if ($("#reference,#pin,#fName,#mName,#datepicker").filter(function() { return $(this).val(); }).length > 0) {
  //..
}

使用如下的通用函数可以使其可重用:

function hasValue(elem) {
    return $(elem).filter(function() { return $(this).val(); }).length > 0;
}

你可以这样称呼它:

hasValue("#my-input-id");

【讨论】:

    【解决方案2】:

    试试 jQuery each()

     $('input[type=text]').each(function(){
         var text_value=$(this).val();
         if(text_value!='')
           {
            console.log('Value exist');
            }
    
       })
    

    【讨论】:

    • OP 可能没有输入标签的所有字段!
    • @C-link,他说“选择多个文本输入”
    【解决方案3】:

    filter() 上获取length 属性的问题在于,jQuery 将评估集合中的每个元素,只是在我们关心的只是值是否大于零时填充一个计数。

    当前的答案,甚至 jQuery 自己的 .is().has().filter() 都没有在满足条件后立即使用短路。

    您可以像这样定义一个名为.any() 的简单扩展方法:

    jQuery.fn.any = function(filter){ 
        for (i=0 ; i<this.length ; i++) {
         if (filter.call(this[i])) return true;
      }
      return false;
    };
    

    然后像这样传入一个过滤函数:

    var someInputsEmpty = $("#reference,#pin,#fName,#mName,#datepicker").any(function() { 
        return this.value == '';
    });
    

    jQuery.fn.any = function(filter){ 
    	for (i=0 ; i<this.length ; i++) {
      	 if (filter.call(this[i])) return true;
      }
      return false;
    };
    
    $(function() {
    	
      var gotMatch = $(":input").any(function() { 
                       return this.value == 'hi';
                     });
    
      if (gotMatch) {
        console.log("Hello to you too!");
      } else {
      	console.log("Why don't you say Hi!");
      }
      
    })
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    
    <input type="text" value="">
    <input type="text" value="">
    <input type="text" value="">

    延伸阅读:

    【讨论】:

      【解决方案4】:

      就用这个吧:

      if (!$("#id").val().length == 0))
      

      【讨论】:

      • 或者如果是完整的一段代码,使用代码块缩进四个空格,就像我刚刚做的那样。
      【解决方案5】:

      怎么样:

      http://jsfiddle.net/lollero/rr2ss/1/

      另一个例子:http://jsfiddle.net/lollero/rr2ss/12/

      $(function() {
      
          // Check value of each and every input element....
          // Which you can of course change to be more specific, like: $('#myForm input')
          $( "input" ).val(function( i, val ) {
      
              // Return the console log IF value is not empty
              // value=" " still counts as "not empty", because technically it isn't
              // You could of course replace the console.log(); with anything you'd like
              val && console.log('not empty: input-' + (++i) );
      
              // Note that you don't have to return val if you don't  want to, it's just for show in this case.
              return val
      
          });
      
      });
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2016-07-27
        • 1970-01-01
        • 1970-01-01
        • 2021-11-08
        • 2016-06-10
        • 1970-01-01
        相关资源
        最近更新 更多