jQuery检查是否有任何文本输入有值

时间:2022-11-13 18:45:38

I want to ask if there's a better way in jQuery to select multiple text input then check if any of them has a value. Here's my code:

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

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

5 个解决方案

#1


46  

You could do like below:

你可以这样做:

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

Using a common function like the following would make it reusable:

使用如下的常用功能可以使其重用:

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

And you could call it like this:

你可以这样称呼它:

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

#2


7  

Try jQuery each()

尝试jQuery each()

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

   })

#3


3  

Just use this:

只需使用:

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

#4


1  

The problem with getting the length property on filter() is that jQuery will evaluate every single element in the collection, just to populate a count when all we care about is whether the value is greater than zero.

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

None of the current answers and even jQuery's own .is(), .has(), and .filter() make use of short circuiting as soon as the criteria is met.

当前的答案,甚至jQuery自己的.is(),. has()和.filter()都不会在符合条件时立即使用短路。

You can define a simple extension method called .any() like this:

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

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

And then pass in a filtering function like this:

然后传入这样的过滤函数:

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="">

Further Reading:

#5


0  

How about:

怎么样:

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

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

Another example: http://jsfiddle.net/lollero/rr2ss/12/

另一个例子: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

    });

});

#1


46  

You could do like below:

你可以这样做:

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

Using a common function like the following would make it reusable:

使用如下的常用功能可以使其重用:

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

And you could call it like this:

你可以这样称呼它:

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

#2


7  

Try jQuery each()

尝试jQuery each()

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

   })

#3


3  

Just use this:

只需使用:

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

#4


1  

The problem with getting the length property on filter() is that jQuery will evaluate every single element in the collection, just to populate a count when all we care about is whether the value is greater than zero.

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

None of the current answers and even jQuery's own .is(), .has(), and .filter() make use of short circuiting as soon as the criteria is met.

当前的答案,甚至jQuery自己的.is(),. has()和.filter()都不会在符合条件时立即使用短路。

You can define a simple extension method called .any() like this:

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

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

And then pass in a filtering function like this:

然后传入这样的过滤函数:

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="">

Further Reading:

#5


0  

How about:

怎么样:

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

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

Another example: http://jsfiddle.net/lollero/rr2ss/12/

另一个例子: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

    });

});