在页面加载上运行jquery-ui小部件

时间:2012-02-13 20:02:15

标签: javascript jquery jquery-ui

我有一个基本的jquery-ui对话框小部件,设置为在点击处理程序上执行:

jQuery(document).ready(function() {
    $('.menu_link').click(function(e) {
        e.preventDefault();
        var $this = $(this);
        var horizontalPadding = 0;
        var verticalPadding = 15;
        $('<iframe id="externalSite" class="externalSite" src="' + this.href + '" />').dialog({
            autoOpen: true,
            width: 600,
            height: 550,
            modal: true,
            resizable: true,
            autoResize: true,
            scrolling: false,
            close: function(ev, ui) { $(this).remove(); },
            overlay: {
                opacity: 0.9,
                background: "white"
            }


        }).width(580 - horizontalPadding).height(550 - verticalPadding);            
    });
});

我想要做的是将其设置为在页面加载时执行。另外(优先级较低)有一个简单的方法我可以在计时器上设置它...例如,在页面加载5秒后对话框启动?

1 个答案:

答案 0 :(得分:1)

删除单击处理程序并将代码包装到函数中(此处称为showIFrame) 要在5秒后启动它,请使用setTimeout 在第2行输入iframe的网址。

function showIFrame() {
    var url = '>enter url here<';
    var horizontalPadding = 0;
    var verticalPadding = 15;
    $('<iframe id="externalSite" class="externalSite" src="' + url + '" />').dialog({
        autoOpen: true,
        width: 600,
        height: 550,
        modal: true,
        resizable: true,
        autoResize: true,
        scrolling: false,
        close: function(ev, ui) { $(this).remove(); },
        overlay: {
            opacity: 0.9,
            background: "white"
        }
    }).width(580 - horizontalPadding).height(550 - verticalPadding);
}
setTimeout(showIFrame, 5000);

另请参阅此示例withwithout代码。