Выберите предыдущий тег абзаца в нескольких сценариях

80
11

Я новичок в jQuery и задаюсь вопросом, есть ли элегантный способ выбора тегов в двух разных сценариях DOM. Я использую jQuery для проверки формы и добавления класса ошибки в тег абзаца (который выделяет текст и выделяет его красным цветом), если входное значение пуст. Некоторые абзацы и теги ввода существуют в DOM следующим образом:

<td><p>Name:</p></td><td><input type="text" name="field_name"></td>

В то время как другие существуют так:

<td><p>Name:</p><input type="text" name="field_name"></td>

Моя функция jQuery выглядит так:

$("#form_id").submit(function() {
var answer = true;
$(this).find(".required").map(function() {
if(!$(this).val()) {
$(this).closest("td").prev("td").find("p").addClass("form_error");
answer = false;
}
else {
$(this).closest("td").prev("td").find("p").removeClass("form_error");
}
});
return answer;
});

Ключевой линией является следующее:

$(this).closest("td").prev("td").find("p").addClass("form_error");

Это явный выбор p-тегов в моем первом сценарии DOM, но, конечно, он не работает во втором. Я ищу одну строку кода, которая будет выбирать теги p в обоих сценариях. Я играл с .prev("p") но пока не понял. Есть ли способ сделать это?

спросил(а) 2021-01-19T22:08:16+03:00 9 месяцев, 1 неделя назад
1
Решение
79

Если ввод текста и его заголовок (текст внутри тегов <p>) являются единственными в пределах одной строки, вы можете использовать селектор, подобный одному из них:

$('.required').parents('tr:first').find('p').addClass('form_error');

$('.required').closest('tr').find('p').addClass('form_error');

Ниже приведено описание вышеупомянутого решения: http://jsfiddle.net/Lyaqp/2/

ответил(а) 2021-01-19T22:08:16+03:00 9 месяцев, 1 неделя назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема