5

如何使用 jQuery.live 完成这项工作？

$("a[rel]").overlay({
    mask: '#3B5872',
    effect: 'apple',
    api: true,
    onBeforeLoad: function () {
        var wrap = this.getOverlay().find(".contentWrap");
        wrap.load(this.getTrigger().attr("href"));
    }
});

我试过这个没有成功：

$("a[rel]").live('click', function () {
    alert('live');
    $(this).overlay({
        mask: '#3B5872',
        effect: 'apple',
        api: true,
        onBeforeLoad: function () {
            var wrap = this.getOverlay().find(".contentWrap");
            wrap.load(this.getTrigger().attr("href"));
        }
    });
});
4

3 回答 3

13

您需要将其设置为加载配置。您可以通过添加load: true到配置对象来做到这一点。

$("a[rel]").live('click', function (e) {
    e.preventDefault(); //prevent default link action

    $(this).overlay({
        mask: '#3B5872',
        effect: 'apple',
        api: true,
        onBeforeLoad: function () {
            var wrap = this.getOverlay().find(".contentWrap");
            wrap.load(this.getTrigger().attr("href"));
        },
        load: true
    });
});

这是文档。

于 2010-07-24T18:09:35.907 回答
2

覆盖在 a 上触发click，因此您需要使用loadoption，如下所示：

$("a[rel]").live('click', function (e) {
    $(this).overlay({
        mask: '#3B5872',
        effect: 'apple',
        api: true,
        load: true,
        onBeforeLoad: function () {
            var wrap = this.getOverlay().find(".contentWrap");
            wrap.load(this.getTrigger().attr("href"));
        }
    });
    e.preventDefault();
});​

你可以在这里试一试。

叠加层是由他的click事件打开的，因此即使您绑定了叠加层，它也没有打开，因为它所依赖的事件已经发生。的默认值load也是false，但由于您确实希望它在创建后立即打开，请将其设置为true:)

于 2010-07-24T17:47:43.793 回答
2

现在它工作正常。对于所有像我一样有同样麻烦的人，这里是代码；）

<script type="text/javascript">
    // safe the overlay element in a global variable
    var overlayElem;

    $(document).ready(function () {
        // register the click event for ajax load and page load
        $("a[rel]").live('click', function (e) {
            e.preventDefault();

            // save overlay
            overlayElem = $(this); 

            // load overlay
            $(this).overlay({
                mask: '#3B5872',
                effect: 'apple',
                api: true,
                load: true,
                onBeforeLoad: function () {
                    var wrap = this.getOverlay().find(".contentWrap");
                    wrap.load(this.getTrigger().attr("href"));
                }
            });
        });
    });

    // send form data via ajax
    function ajaxFormRequest(form, callback, format) {
        $.ajax({
            url: form.action,
            type: form.method,
            dataType: format,
            data: $(form).serialize(),
            success: callback
        });
    }
    // close the overlay and update the table 
    function update_grid(result) {
        overlayElem.overlay().close();
        $("#gridcontainer").html(result);
    }

</script>
于 2010-08-20T22:23:37.263 回答