我正在使用twitter boostrap,我想从另一个页面获取html并将其加载到我当前页面的模态中。所以我创建了一个javascript函数来处理这个问题。
在我的'index.php'中我有这个:
<button onclick="popIt('create_event.php', 'Create Event');" data-toggle="tooltip" data-placement="top" data-original-title="Edit" class="btn ttp"><i class="icon-pencil"></i></button>
<button onclick="popIt('tester.php', 'Test Head');" data-toggle="tooltip" data-placement="top" data-original-title="Delete" class="btn btn-danger ttp"><i class="icon-remove icon-white"></i></button>
javascript函数是这样的:
<script>
function popIt(url, header) {
$('#myModal').modal({
remote: url
});
$('#myModalLabel').html(header);
}
当我点击按钮时会加载相应的页面,但当我关闭模态并单击另一个按钮时,它仍会加载上一页。
请问我做错了什么? 感谢
答案 0 :(得分:1)
完成隐藏后销毁对象
$('body').on('hidden', '.modal', function () {
$(this).removeData('modal');
});
答案 1 :(得分:0)
我在Bootstrap的模态小部件方面遇到了很多问题。两个主要问题是IE中的缓存和模式函数,在使用远程属性之前触发事件之前不等待ajax调用完成。我通过创建一个包装来修复这些问题来创建模态对话框。要修复缓存问题,请执行$ .get并在URL中添加timestamp参数,并在初始化模式窗口小部件之前将响应设置为content属性。请参阅下面的代码。希望这有帮助!
var $queue = $({});
if (settings.remote) {
$queue.queue('modal_open', function(next) {
$.when($.get(settings.remote + '×tamp=' + new Date().getTime())).done(function(content) {
settings.content = content;
settings.remote = undefined;
next();
});
});
}
$queue.queue('modal_open', function(next) {
...
$modal.modal(settings);
next();
}
$queue.dequeue('modal_open');
return $modal;
答案 2 :(得分:-1)
在$('#myModal').empty()
函数的第一行尝试popIt
。它可能是导致服务器响应延迟的原因
如果没有,你可以尝试融合获取请求和模态,例如,
$.get(url,function(data){
$('#myModal').html(data)
}