Почему .click () не работает в этом случае? - PullRequest
Новая
       1

Почему .click () не работает в этом случае?

0 голосов
/ 15 апреля 2010

По сути, это происходит, когда fadeIn уже существующих div и затем загружает изображение. Когда изображение загружено, оно добавляет его в один из уже существующих элементов div. Затем он добавляет новый div с идентификатором xButton. Затем позже $ ('# xButton'). Click () должен скрыть 3 деления. Однако это просто не работает. Если я изменю click () на #modalImage или #overlay, это будет работать, но только не для кнопки #x. Я действительно хотел бы выяснить, почему это не работает и как я должен делать это вместо этого. Спасибо. 

$(function(){
                $('#container a').click(function(e){
                    e.preventDefault();
                    var id = $(this).attr('href'),
                    img = new Image();


                    $('#overlay').fadeIn(function(){
                        $('#modalImage').fadeIn();

                    });

                    $(img).load(function(){
                        $(this).hide();
                        $('#modalImage').removeClass('loader').append(this);
                        $(this).fadeIn(function(){
                            var ih = $(this).outerHeight(),
                            iw = $(this).outerWidth(),
                            newH = ($(window).height()/10)*7,
                            newW = ($(window).width()/10)*7;


                            if (ih >= iw && ih >= newH) {
                                $(this).css('height',newH + 'px');
                                $(this).css('width', 'auto');
                            }
                            else if (ih >= iw && newH > ih) {
                                $(this).css('height', ih + 'px');
                                $(this).css('width', 'auto');
                            }
                            else if (iw > ih && iw >= newW) {
                                if ((newW / (iw / ih)) > newH) {
                                    $(this).css('width', 'auto');
                                    $(this).css('height', newH + 'px');
                                }
                                else {
                                    $(this).css('width', newW + 'px');
                                    $(this).css('height', 'auto');
                                }

                            }
                            else  {
                                $(this).css('width', iw + 'px');
                                $(this).css('height', 'auto');
                            }

                            var padW = ($(window).width() - $(this).outerWidth()) / 2, 
                            padH = ($(window).height() - $(this).outerHeight()) / 2;
                            console.log (padH + ' ' + padW);
                                $(this).css('top', padH);
                              $(this).css('left', padW);

                            if($('#overlay').is(":visible") == true) {
                                ih = ih + 4;
                                $('<div id="xButton">x</div>').appendTo('#modalImage');
                                if (padH >= 0) {
                                    $('#xButton').css('top', padH - 4).css('right', padW - 65);
                                }
                                else {
                                    $('#xButton').css('top', '20px').css('right', padW - 65);
                                }
                            }
                        });

                    }).attr('src', id);
                });
                $('#xButton').click(function(){
                    $(this).hide();
                    $('#overlay').fadeOut(function(){
                        $('#modalImage img').css('top', '-9999px').remove();
                        $('#xButton').remove();
                        $('#modalImage').addClass('loader');
                    });
                });
            });

Ответы [ 2 ]

2 голосов
/ 15 апреля 2010

Если вы устанавливаете элемент динамически, вам нужно привязать слушателя, проще всего использовать функцию jquery live ():

http://api.jquery.com/live/

1 голос
/ 15 апреля 2010

Похоже, что xButton создается после того, как щелчок вовремя прикреплен.Если вы собираетесь это сделать, вам нужно обязательно установить xButton.click после фактического создания xButton, а не до этого.Или вы можете использовать live или делегат методы, как описано в документации.

...