Question

我正在尝试将jsp文件加载到jQuery UI对话框http://jqueryui.com/demos/dialog/中。 jsp包含fullCalendar http://arshaw.com/fullcalendar/日历。控制台调用calLoader.jsp，它或多或少只包含：

<jsp:include page="../cal.jsp"/>

当我第一次打开对话框时，一切正常，但在关闭对话框并尝试再次打开后，我从Chrome获得以下堆栈跟踪：

Uncaught RangeError: Maximum call stack size exceeded
d.d.extend._Deferred.f.resolveWith
d.d.extend._Deferred.f.done
d.d.fn.d.ready
d.d.fn.d.init
d.d
(anonymous function)
d.d.extend.globalEval
ba
d.d.extend.each
d.fn.extend.domManip
d.fn.extend.append
d.fn.extend.html
d.fn.extend.load.d.ajax.complete
d.d.extend._Deferred.f.resolveWith
v
d.support.ajax.d.ajaxTransport.send.c

firefox中的问题是一样的，但我收到了消息：

too much recursion
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />

我意识到我正在尝试加载多个相同的东西，并且它需要重新使用或卸载/删除并重新加载，但我不知道如何做到这一点。

这是我用来打开日历的代码（已请求）。

function openCalendar() {
    var dialog = jQuery('<div id="calendaropener"></div>')
    .dialog({
        autoOpen: false,
        draggable: true,
        modal: false,
        resizable: false,
        width: 820,
        height: 750,
        position: [50, 50],
        title: 'Kalender',
        close: function(ev, ui) { calendarObj = null; }
    });
    dialog.load("calLoader.jsp");
    dialog.dialog('open');
}

从我页面上的按钮调用openCalendar（）函数。谢谢！

Answer 1

我的猜测是，在你关闭第一个之后它只会隐藏，然后你创建另一个具有相同id的元素，这会导致加载过程出现问题。理想情况下，为了对DOM进行更多控制，我首先在主页面中创建日历开启器div，然后创建对话框：

$("#calendaropener").dialog(...

这可以帮助您更轻松地管理/调试它。

如果您不想这样做，那么您可以尝试添加到关闭功能：

close: function(ev, ui) { calendarObj = null; $(this).remove(); }

这将确保从DOM中删除元素，这样您就不会再多次添加元素时出现任何奇怪的问题。

最后，如果您只想处理隐藏和重新打开（假设这不会破坏您的逻辑），那么您可以有条件地触发dialog.load("calLoader.jsp");，例如：

if($(dialogSelector).html().length == 0) {
    dialog.load("calLoader.jsp");
}

希望有所帮助！

卸载/删除或重用已加载的javascript

1 个答案: