JQuery 检查 < input > 是否存在并且有一个值

小开

You could do:

if($('.input1').length && $('.input1').val().length)

length evaluates to false in a condition, when the value is 0.

小开

You can do something like this:

jQuery.fn.existsWithValue = function() {
return this.length && this.val().length;
}


if ($(selector).existsWithValue()) {
// Do something
}

小开

最佳答案

The input won't have a value if it doesn't exist. Try this...

if($('.input1').val())

小开

Just for the heck of it, I tracked this down in the jQuery code. The .val() function currently starts at line 165 of attributes.js. Here's the relevant section, with my annotations:

val: function( value ) {
var hooks, ret, isFunction,
elem = this[0];


/// NO ARGUMENTS, BECAUSE NOT SETTING VALUE
if ( !arguments.length ) {


/// IF NOT DEFINED, THIS BLOCK IS NOT ENTERED. HENCE 'UNDEFINED'
if ( elem ) {
hooks = jQuery.valHooks[ elem.type ] || jQuery.valHooks[ elem.nodeName.toLowerCase() ];


if ( hooks && "get" in hooks && (ret = hooks.get( elem, "value" )) !== undefined ) {
return ret;
}


ret = elem.value;


/// IF IS DEFINED, JQUERY WILL CHECK TYPE AND RETURN APPROPRIATE 'EMPTY' VALUE
return typeof ret === "string" ?
// handle most common string cases
ret.replace(rreturn, "") :
// handle cases where value is null/undef or number
ret == null ? "" : ret;
}


return;
}

So, you'll either get undefined or "" or null -- all of which evaluate as false in if statements.

小开

I would do something like this: $('input[value]').something . This finds all inputs that have value and operates something onto them.

小开

You can create your own custom selector :hasValue and then use that to find, filter, or test any other jQuery elements.

jQuery.expr[':'].hasValue = function(el,index,match) {
return el.value != "";
};

Then you can find elements like this:

var data = $("form input:hasValue").serialize();

Or test the current element with .is()

var elHasValue = $("#name").is(":hasValue");

jQuery.expr[':'].hasValue = function(el) {
return el.value != "";
};




var data = $("form input:hasValue").serialize();
console.log(data)




var elHasValue = $("[name='LastName']").is(":hasValue");
console.log(elHasValue)

label { display: block; margin-top:10px; }

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


<form>
<label>
First Name:
<input type="text" name="FirstName" value="Frida" />
</label>


<label>
Last Name:
<input type="text" name="LastName" />
</label>
</form>

Further Reading:

小开

if($('#user_inp').length > 0 && $('#user_inp').val() != '')
{


$('#user_inp').css({"font-size":"18px"});
$('#user_line').css({"background-color":"#4cae4c","transition":"0.5s","height":"2px"});
$('#username').css({"color":"#4cae4c","transition":"0.5s","font-size":"18px"});


}