jquery对话框多个打开

时间:2013-01-07 19:02:22

标签: javascript jquery html dialog

我有那个网址:

<a onClick="showDialog({$product['id']});">More Info...</a>

另外我有:

function showDialog(productID)
{
    $( "#dialog-modal_"+productID ).html( "<iframe src='index.php?act=showProduct&amp;id="+productID+"' width='100%' height='100%' frameborder='0' scrolling='no'></iframe>" );
    $( "#dialog-modal_"+productID ).dialog({
    width: 810,
    height: 590,
    resizable: false,
    modal: true,
    open: function(event, ui)
    {
        event.preventDefault();
    }
    });
    container
        .dialog('option', 'title', 'Your Title')
        .dialog('option', 'buttons', {
            Close: function() {
                $(this).dialog('close');
            }
        })
        .dialog('open');

    var stateObj = { foo: "bar" };
    window.history.pushState(stateObj, "page 2", "{$info['siteurl']}/index.html#product-"+productID);

}

如果我一旦工作就打开它,但如果我再试一次,它就不会打开。 我需要找到一种方法来“清除”当前ID的最后一个对话框。 对于不同的对话框,它只能工作一次。

1 个答案:

答案 0 :(得分:2)

产品循环内部:

<a href="javascript:" class="productOpener" data-id="{$product['id']}">more info...</a>

你的javascript:

$(".productOpener").click(function() {
    showDialog($(this).data("id"));
});

修改你的showDialog以便在需要时创建模态div:

function showDialog(productID) {
    var _modal = $("<div/>"); //add whatever styling you need
    _modal.html( "<iframe src='index.php?act=showProduct&amp;id="+productID+"' width='100%' height='100%' frameborder='0' scrolling='no'></iframe>" );
    _modal.dialog({ ... });
    ...
}