Как правильно указать data в $(this)?

Question

[Михаил Р.]

Всем привет! Написал скрипт, который проверяет все input поля на пустоту, как правильно дописать скрипт, что-бы он помимо пустоты смотрел и наличие в input data-type="required"?
Проверяет все пустые поля:

$('input').each(function () {
            if($(this).val() == '') {
                $(this).addClass('notFilled');
            };
        });

Мои попытки указать еще и data атрибуты:

$('input').each(function () {
            if($(this['data-type=required']).val() == '') {
                $(this).addClass('notFilled');
            };
        });

Если не сложно, то хотел-бы еще лицезреть аналогичный вариант, но теперь с проверкой пустоты и класса.
Спасибо!

Answer 1

[Вячеслав]

Например, так

if ($(this).attr('data-type') == 'required' && $(this).val() == '')

Answer 2

[Roman]

Дата теги можно использовать напрямую а не через attr

if ($(this).data('type') == 'required' && $(this).val() == '')

По классу проверяем также:

/* данный вариант применим только когда класс у элемента один, в противном случае присвоятся все классы */
if ($(this).attr('class') == 'required' && $(this).val() == '')

/* когда элементу присвоено несколько классов можно проверять с помощью hasClass */
if ($(this).hasClass('you_search_class') && $(this).val() == '')

Comments

[Kovalsky]

Не ради флейма, а только справедливости ради хочу заметить, что
1) не дата теги, а скорее дата атрибуты,
2) приведённый вами пример использования .data() - это вообще достаточно вакуумный случай, потому что такое можно делать только если в проекте более нигде не используется дата байндинга который осуществляет .data() и только для решения таких вот простеньких, мелких задач. Хотя бы потому что информация, которую сохраняет .data(), является для $ более приоритетной: при наличии у элемента el атрибута data-test и data-записи c ключом test, el.data('test') вернёт вам значение data-записи, а не атрибута. По этой же причине вызов el.data('key', value) не изменит/создаст атрибут 'data-key', а сделает data-запись, доступ к которой будет возможен только с использованием этого метода.

Поэтому используя .attr() для доступа к data-атрибутам, вы все же в значительной степени снижаете уровень энтропии логики вашего кода)

Answer 3

[Денис Князев]

...........
if ( $(this).attr('data-type')=='required') && $(this).val() == '' ) {
///TODO
}