jQuery проверить, если существует и имеет значение


у меня есть следующий пример:

<input type="text" class="input1" value="bla"/>

есть ли способ проверить, существует ли этот элемент и имеет ли значение в одном операторе? Или, по крайней мере, что-нибудь короче

if($('.input1').length > 0 && $('input1').val() != '')

просто расстраиваюсь здесь с Милей-длинными условиями.

6 53

6 ответов:

вход не будет иметь значения, если он не существует. Попробовать это...

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

вы могли бы сделать:

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

length значение false в состоянии, когда значение 0.

вы можете сделать что-то вроде этого:

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

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

просто для этого, я отследил это в коде jQuery. Этот.функция val () в настоящее время начинается в строке 165 из атрибуты.js. Вот соответствующий раздел, с моими аннотациями:

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;
    }

Итак, вы либо получите undefined или "" или null -- все из которых оцениваются как ложные в операторах if.

вы можете создать свой собственный пользовательский селектор:hasValue и затем используйте это для поиска, фильтрации или тестирования любых других элементов jQuery.

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

тогда вы можете найти такие элементы:

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

или проверить текущий элемент с .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>

Более Дальнеишее Чтение:

Я бы сделал что-то вроде этого: $('input[value]').something . Это находит все входные данные, которые имеют значение и работает что-то на них.