Событие Jquery click - для запуска требуется два клика

Question

Это может быть очень просто - но я изо всех сил пытаюсь определить, что происходит.

На JS Fiddle: http://jsfiddle.net/3hHAX/

Есть две ссылки, выводимые на 'Открыть видео модальное'.

Поскольку текст ссылки предполагает, что эти две ссылки должны открыть всплывающее окно модели с видео YouTube.

Используется библиотека prettyphoto из: http://www.no -margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/

По какой-то причине событие щелчка не срабатывает при первом щелчке.Но работает на секунду.

(Я не включил CSS, поэтому выглядит не очень модально, но вы увидите загрузку контента ниже, по крайней мере, для демонстрации).

Кто-нибудь может подсказать, что идет не так?

Спасибо,

Стив

Answer 1

Инициировать событие щелчка после его инициализации и разрешить его инициализацию только один раз.

(function($) {    
    $(".watch-this a, .field-name-field-embed-code a").live('click',function(){
        if (!$(this).is(".pPhoto")) {
            $(this).prettyPhoto({
                social_tools: ''
            }).addClass("pPhoto").click();     
        }
        return false;    
    });
})(jQuery);

Демо: http://jsfiddle.net/3hHAX/3/

Редактировать для уточнения:
Это очень распространенный способ инициализации плагина на динамических элементах. Как уже отмечалось, лучше инициализировать на dom ready, если ваши элементы не являются динамическими.

Примечание:
.live устарел, вы действительно должны использовать .on

(function($) {    
    $(document).on("click",".watch-this a, .field-name-field-embed-code a",function(){
        if (!$(this).is(".pPhoto")) {
            $(this).prettyPhoto({
                social_tools: ''
            }).addClass("pPhoto").click();     
        }
        return false;    
    });
})(jQuery);

Answer 2

Спасибо, ребята,

Оба ответа помогли мне в конечном итоге решить эту проблему.

Конечное решение в обновленном JSFiddle:

http://jsfiddle.net/3hHAX/6/

Кажется, что prettyPhoto присоединяет свое собственное событие к клику, и просто необходимо применить его к этим элементам dom.

Спасибо, Стив

Answer 3

• Прежде всего, никогда не используйте метод live в jquery, за исключением ситуаций, когда dom действительно находится вне вашего контроля.По крайней мере, вы должны использовать функцию делегата, так как живая функция вызовет большое замедление и много проблем (хотя в этот раз это не было ошибкой)
• Во-вторых, событие click срабатываеткак вы можете видеть здесь , но компонент prettyPhotos не работает первый раз по неизвестным мне причинам, но, как вы можете видеть в предыдущей ссылке jsfiddle, он работает св первый раз, когда вы щелкаете мышью, это звучит для меня как ошибка в сценарии prettyphotos (которую, похоже, Хевин Б. решительно решил, вызвав событие второго щелчка).