JQuery селектор для пустого значения

Question

Как я мог бы создать селектор для использования с .is() функции в JQuery, который представляет следующие выражения:

$('[name="Person[firstName]"]').val() === ''; // true 
$('[name="Person[lastName]"]').val() === ''; // false 

С этой HTML контексте

<input name="Person[firstName]" value="" > 
    <foo bar="true" /> 
</input> 

<input name="Person[lastName]" value="ABCDEFGH" /> 

: пусто Selector Выберите все элементы, у которых нет детей (включая текстовые узлы).

$('[name="Person[firstName]"]').is(':empty'); // false 
$('[name="Person[lastName]"]').is(':empty'); // true 

Другие попробовать

$('[name="Person[firstName]"]').is('[value=""]'); // true 
$('[name="Person[lastName]"]').is('[value=""]'); // true 

Примечание: Это вопрос для целей знания - и .() должны быть использованы в этом растворе.

@edithttp://jsfiddle.net/2CzWu/2/

Она должна возвращать ложь в обоих выражениях

Answer 1

Причины :empty не работает потому, что она ищет узлы без дочерних узлов, которые не то, что вы ищете.

$.is("[value='']") будет работать только со значениями, которые были установлены вначале HTML, а не при обновлении его через сценарий или пользовательский интерфейс. Это связано с тем, что селектор атрибутов смотрит на Node.getAttribute('value') === ''and the XML attribute is not updated when the DOM object is, но свойство DOM HTMLInputElement.value делает.

So what we really need is a custom pseudo selector that looks at the value DOM property и it's pretty simple to implement. Он работает с $.is и с :not()

$.expr[':'].emptyVal = function(obj){ 
    return obj.value === ''; 
}; 

var $firstName = $('[name="Person[firstName]"]'); 

$firstName.val('AAAA'); 

$('input:emptyVal').size(); // 2 
$('input:not(emptyVal)').size(); // 0 
$firstName.is('input:emptyVal'); // false 
$firstName.is('input:not(:emptyVal)'); // true