2

我正在使用 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);
    }

当我单击按钮时，这会加载相应的页面，但是当我关闭模式并单击另一个按钮时，它仍会加载上一页。

请问我做错了什么？谢谢

4

3 回答 3

1

完成隐藏后销毁对象

$('body').on('hidden', '.modal', function () {
    $(this).removeData('modal');
});
于 2013-07-24T21:46:04.143 回答
0

我对 Bootstrap 的模态小部件有很多问题。两个主要问题是 IE 中的缓存和模态函数在使用远程属性时触发事件之前不等到 ajax 调用完成。我通过创建包装器来创建模式对话框来解决这些问题。要修复缓存问题，请执行 $.get 并向 URL 添加时间戳参数，并将响应设置为 content 属性，然后再初始化模式小部件。请参阅下面的代码。希望这可以帮助！

var $queue = $({});
if (settings.remote) {
  $queue.queue('modal_open', function(next) {
    $.when($.get(settings.remote + '&timestamp=' + 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;
于 2013-11-01T15:17:23.733 回答
-1

尝试$('#myModal').empty()在popIt函数的第一行。这可能是从服务器获取响应延迟的原因

如果不是，您可以尝试融合获取请求和模态，例如，

$.get(url,function(data){
   $('#myModal').html(data)
}
于 2013-06-20T08:44:09.790 回答