JQuery каждый возвращает только первое значение

Question

JQuery каждый возвращает только первое значение

0

я хотел бы пройти через каждого человека и получить размер изображения. С высотой и шириной я могу установить высоту и ширину для div ".text-person-show".

$(window).load(function () {
    $(".person").each(function () {
        var h = $(this).find(".person-image").height();
        var w = $(this).find(".person-image").width();

        $(this).hover(function () {
            alert(w);
            $(this).find(".person-image").toggle();
            $(this).find(".text-person").toggle();
            $(this).find(".text-person").toggleClass("text-person-show", 'add');
            $(".text-person-show").width(w).height(h);
        });
    });
});

HTML:

<div class="person">
<div class="person-post">
    <div class="person-image">  <img src="<?php the_field('image'); ?>"></div>
        <div class="text-person">
            <div class="text-inner">
                 <div class="name-person-text-inner"><?php the_title(); ?>
                 </div>     
            </div>
        </div>
</div>

Вопрос: почему я получаю только предупреждение (w) для первого ".person"? Я не понимаю сейчас! переменная область?

Много спасибо !!!

meck373 02 май 2014, в 14:42

Источник

1

Потому что это предполагаемое поведение геттера, запускаемого в коллекции; что вы ожидали / хотели получить?
David Thomas 02 май 2014, в 11:50
1

Всякий раз, когда я вижу ручное связывание событий внутри цикла, я чувствую себя плохо.
David Barker 02 май 2014, в 11:51
0

Мне нравится получать значения для каждого .person
meck373 02 май 2014, в 11:51
0

А где соответствующий HTML? Скрипка тоже будет отличной
Yaron U. 02 май 2014, в 11:51
0

Возможно, у вас есть только один .person
Amit Joki 02 май 2014, в 11:52
0

прикрепить переменную к окну ..... например ... window.myVar = "global value" ..
kebyang 02 май 2014, в 11:57
0

Кстати, в вашем HTML нет элемента с именем класса text-person-show (однако есть text-person , text-inner и name-person-text-inner ).
David Thomas 02 май 2014, в 12:53

Показать ещё 5 комментариев

Теги:

jquery

1 ответ

Ещё вопросы

Потому что это предполагаемое поведение геттера, запускаемого в коллекции; что вы ожидали / хотели получить?
Всякий раз, когда я вижу ручное связывание событий внутри цикла, я чувствую себя плохо.
Мне нравится получать значения для каждого .person
А где соответствующий HTML? Скрипка тоже будет отличной
Возможно, у вас есть только один .person
прикрепить переменную к окну ..... например ... window.myVar = "global value" ..
Кстати, в вашем HTML нет элемента с именем класса text-person-show (однако есть text-person , text-inner и name-person-text-inner ).

Neel · Accepted Answer · 2014-05-02T09-06-00.000Z

попробуйте под кодом и используйте событие.on для будущих событий, а также удалите каждый цикл.

$(window).load(function () {                    
        $('.person').on('hover', function () {
        var h = $(this).find(".person-image").height();
        var w = $(this).find(".person-image").width();

            alert(w);
            $(this).find(".person-image").toggle();
            $(this).find(".text-person").toggle();
            $(this).find(".text-person").toggleClass("text-person-show", 'add');
            $(".text-person-show").width(w).height(h);
        });
       });

Боковое примечание Как было предложено Дэвидом Томасом:

on() был доступен в jQuery версии 1.7 (в этот момент live() устарел). В jQuery до 1.7 команда jQuery рекомендовала в документации API для самого метода использовать делегат(). Функция live() имеет ряд проблем (цепочка, разбухание событий и производительность) и не должна использоваться даже там, где она доступна (если не подтверждены компромиссы в documentaiton для метода).

on() был доступен в jQuery с версии 1.7 (в этот момент live() устарела). В jQuery до 1.7 команда jQuery рекомендовала в документации API для самого метода использовать delegate() . live() есть ряд проблем (цепочка, всплывающее событие и производительность), и ее не следует использовать даже там, где она доступна (если не подтверждены компромиссы в документе для метода).
Спасибо за информацию @DavidThomas Я обновил ответ соответственно