Наложение jQuery Tools не отображается при втором нажатии - PullRequest
2 голосов
/ 21 ноября 2011

Вот что я пытаюсь сделать - я пишу универсальную функцию наложения, которая будет служить для всех ссылок с определенным классом.Это очень просто, у вас есть такая ссылка:

<a class="modalInput" rel="#prompt">Local load</a>

, и когда вы щелкаете по ней, включается javascript:

        $(".modalInput").live("click",function()
    {
        var obj = null;
        obj = $(this);
        var container = null;
        if (!(typeof obj.attr("container") === 'undefined'))
        {
            container = obj.attr("container");
        }
        else
        {               
            if (typeof obj.attr("container") === 'undefined')
            {
                container = obj.attr("rel");

                if (container == '#norel')
                {
                    container = randomString();
                    $("#footer").append("<div id='"+container+"' class='gru_curtain_simple_overlay'></div>");                   
                    obj.attr("container", container);
                }
                else
                {
                    container = container.substring(1, container.length);
                }
            }
        }

        test_test(container, obj);
    });

Эта функция получает различные параметры этой ссылки и решаетчто он должен делать.Затем вызывается test_test (), который выглядит следующим образом:

    function test_test(container, obj)
{
    var triggers = jQuery("#"+container).overlay({

        // some mask tweaks suitable for modal dialogs
        mask: {
            color: '#000',
            loadSpeed: 200,
            opacity: 0.9
        },
        closeOnClick: false,
        closeOnEsc: true,
        load: true,
        oneInstance: false,

        onBeforeLoad: function() {
            if ($.trim($("#"+container).html()).length < 25)
            {
                //Check if it's remote
                var remote = obj.attr("remote");                    
                if (!(typeof remote === 'undefined'))
                {
                    //$(container).load(remote);
                    $.get(remote, function(data)
                    {
                        $("#"+container).empty().append(data);
                    });
                }
            }

            //Check if dialog should have close button
            var is_closable = obj.attr("closable");
            if (is_closable)
            {
                $("a.close").hide();
            }

            var wd = parseInt(obj.attr("wd"));
            var hg = parseInt(obj.attr("hg"));

            if (!(typeof wd === 'undefined'))
            {
                $("#"+container).css("width", wd);
            }
            if (!(typeof hg === 'undefined'))
            {
                $("#"+container).animate({
                    height: hg
                }, 800, function()
                {
                    $("#"+container).css("overflow-x", "hidden");
                    $("#"+container).css("overflow-y", "visible");

                });
                //$(container).css("height", hg);
            }
        },

        onLoad: function() {            
        },

        onClose: function() {
            //Destroy current container
            //var container = obj.attr("rel");
            //$(container).empty().html('<img src="/wp-content/themes/default/images/preloader.gif" style="margin: 25% 25%; width: 120px;"/>');
        }
    });

Я знаю, он огромный, но работает очень хорошо.Так в чем проблема?Если я нажимаю на ссылку, она впервые показывает оверлей.Но когда я нажимаю его снова, он не работает.Он не дает никаких ошибок, никаких предупреждений, в принципе, он должен работать, но это не так.

Я перепробовал все, что приходило мне в голову (например, приведение функции test_test () к ее основам), но это не помоглосделать трюк.Поэтому у меня заканчиваются идеи, и если у кого-то есть предложение, я готов выслушать.

РЕДАКТИРОВАТЬ: Я обнаружил, что если у меня есть другая ссылка, как это:

<a class="modalInput" rel="#norel" remote="/test?t=694749&inner=1" wd="850" hg="500">Remote load</a>

Я могу нажимать на эту ссылку столько раз, сколько я хочу (эта создает случайный div, который добавляется в нижний колонтитул), но после ссылки выше (которая содержит контейнер где-то в HTML, поэтому он ничего не генерирует), все наложения не отображаютсябольше.

1 Ответ

4 голосов
/ 04 мая 2012

, как сказал Эндрю Уитакер, решение показано в Предупреждение jQuery Tools работает один раз (но только один раз)

завернуто: уберите «load: true» из параметров наложения, вызовите .load () вручную.

работает несколько раз:

//call the overlay
$('#idofoverlay').overlay({
//  load: true
}).load();

работает только один раз:

//call the overlay
$('#idofoverlay').overlay({
  load: true
});

Недостатки:

  • в сочетании с оверлеем jquery-tools вы теряете элемент «закрыть» когда называется так
...