1 
<div class="modal hide fade" id="modal_window">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h3>Modal header</h3>
    </div>
    <div class="modal-body">
        <p>One fine body</p>
    </div>
    <div class="modal-footer">
        <a href="#" class="btn">Close</a>
        <a href="#" class="btn btn-primary">Save changes</a>
    </div>
</div>

这是我的html代码，

我想将远程内容加载到其中，比如说 yahoo.com

我试过了

$('#modal_window').attr('data-remote', 'http://www.yahoo.com').modal({show:true, remote:true});

它显示了正常的模态内容，而不是加载到模态中的雅虎。如何将 yahoo.com 加载到模式窗口中？

http://jsfiddle.net/UXU2K/1/

谢谢

4

2 回答 2

1

通过 Javascript 加载远程数据的两种方法是从 AJAX 或通过设置 iFrame 的 url。iFrame 适用于您想要加载整个网站的情况。我会假设你不想要那个。您正在使用 jQuery，因此这里是他们的 ajax 方法http://api.jquery.com/jQuery.ajax/的文档。

下面是使用 jQuery 的 ajax 方法加载远程数据的代码：

    $.ajax({

       url: 'http://www.yahoo.com',
       type: 'GET',
       success: function(data) {

          $('#modal_body').append(html);

       }

    });

顺便说一句，如果您正在加载 HTML（与纯文本相反）并希望将其注入 modal_win 元素，请在成功方法中使用以下代码，而不是我上面的代码：

$(html).appendTo('#modal_body');

于 2012-10-08T03:35:18.410 回答
0

传入remote: true是无效的语法，因为您正在设置 data 属性。如果删除它，您将看到此错误：

XMLHttpRequest 无法加载http://www.yahoo.com/。Access-Control-Allow-Origin 不允许来源http://fiddle.jshell.net 。

如果该页面与您的站点位于同一域中，它将起作用。否则，您将需要使用 iFrame，但这取决于您的应用程序。

于 2012-10-08T03:47:01.503 回答