javascript - 在 Bootstrap 模式中加载 iframe

Question

我想将 iframe 加载到 Bootstrap 模式中，并在加载 iframe 之前显示加载程序。我正在使用一个简单的 jquery 单击函数，但它不起作用。我不明白为什么它不起作用。 fiddle整页fiddle

$('.btn').click(function() {
    $('.modal').on('show',function() {    
        $(this).find('iframe').attr('src','http://www.google.com')
    })
    $('.modal').modal({show:true})
    $('iframe').load(function() {
        $('.loading').hide();
    });
})

Answer 1

$('.modal').on('shown.bs.modal',function(){      //correct here use 'shown.bs.modal' event which comes in bootstrap3
  $(this).find('iframe').attr('src','http://www.google.com')
})

如上所示，使用 bootstrap 3 中的 'shown.bs.modal' 事件。

编辑:-

尝试从 iframe 打开 google.com 以外的一些其他 url，由于某些安全威胁，它不允许您打开 google.com。

这是因为 Google 正在发送“X-Frame-Options: SAMEORIGIN”响应 header 。此选项可防止浏览器显示与父页面不在同一域中的 iFrame。