Jquery не может найти это в операторе if

Question

Я использую jquery и хотел использовать оператор if, чтобы определить ширину диапазона, и если он больше, чем x, добавить класс к тому же объекту

if ($(".tool-tip").width() > 300) {
$(this).addClass("full-width")
}

Я ожидал, что "this"применить класс full-with к классу tool-top

Answer 1

В javascript this относится к содержащей функции.Его можно использовать в jQuery в следующем контексте:

$(".tool-tip").click(function(){
    $(this).addClass("full-width");
})

В вашем случае вам потребуется снова использовать идентификатор, т. Е.

if ($(".tool-tip").width() > 300) {
    $(".tool-tip").addClass("full-width");
}

Редактировать: Кроме того, селектор будетвернуть несколько предметов.Вы можете перебирать их, как показал Pointy, или вы можете просто выбрать первое вхождение, используя $(".tool-tip").eq(0) вместо $(".tool-tip")

Answer 2

this - это область действия функции, означающая, что она будет содержать другое значение, только если внутри функции.Если вы вызываете this вне какой-либо функции, this относится к самому Window.Вызов this изнутри функции относится к самой функции, если только вы не вызываете this из Event, и в этом случае this относится к элементу, который вызвал событие.В вашем случае, если ваш оператор if не находится внутри функции, this будет ссылаться на Window.

Answer 3

Значение this не изменяется в данном контексте функции, но вы можете воспользоваться преимуществом варианта, который jQuery предоставляет для метода .width():

$(".tool-tip").width(function(index, width) {
  if (width > 300)
    $(this).addClass("full-width");
});

, который будет работать каждый элемент с классом "подсказка";если вы просто хотите повлиять на первый, как ваш пример кода (если он работал), вы можете проверить параметр index, который сообщает вам индекс в списке соответствующих элементов.