javascript - 弹出窗口打开时将内容加载到弹出框

Question

我正在使用此脚本在我的网站中有一个带有一些设置的弹出框：

http://codeissue.com/articles/a04daf3210c8b0a/cross-browser-modal-popup-using-javascript-jquery

单击按钮/文本时会打开弹出窗口：

<a href="#" onclick="ShowModalPopup('name_of_div_in_popup_box'); return false;">Text</a>

我想知道是否可以将内容（#name_of_div_in_popup_box）从外部页面（在同一网站中）加载到弹出框中，而不是将 div 隐藏在带有此弹出框的所有页面中。问题是弹出窗口存在于许多页面中，因此在当前情况下，我必须粘贴#name_of_div_in_popup_box到具有弹出窗口的每个页面中，并且在该 div 中进行编辑时，我必须在所有页面中进行编辑。

更容易从外部页面示例 content.html #name_of_div_in_popup_box 将内容加载到弹出框，因此在更改 div 时，我只需在该站点中进行更改。

这可能吗？

谢谢。

Answer 1

Javascript 无法访问服务器上的其他文件（可能使用 AJAX 除外），因为它是客户端。但是，如果您使用 php 或 shtml 包含，这应该允许您从需要它的网页访问文件，而无需添加完整的代码。

Answer 2

使用 jQuery .load()

$('#name_of_div_in_popup_box').load('load_from_this_page.html');

补充说明：

由于浏览器安全限制，大部分“Ajax”请求都受同源策略的约束；请求无法从不同的域、子域或协议成功检索数据。