AJAX 选项卡工作得非常好。这部分非常简单。但是，让 AJAX UI 对话框模式窗口触发链接并不成功。
如有任何帮助，我们将不胜感激。
最佳答案
没有什么比那个男人更容易的了。试试这个:
<?xml version="1.0" encoding="iso-8859-1"?>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/jquery-ui.min.js"></script>
<style>
.loading { background: url(/img/spinner.gif) center no-repeat !important}
</style>
</head>
<body>
<a class="ajax" href="http://www.google.com">
Open as dialog
</a>
<script type="text/javascript">
$(function (){
$('a.ajax').click(function() {
var url = this.href;
// show a spinner or something via css
var dialog = $('<div style="display:none" class="loading"></div>').appendTo('body');
// open the dialog
dialog.dialog({
// add a close listener to prevent adding multiple divs to the document
close: function(event, ui) {
// remove div with all data and events
dialog.remove();
},
modal: true
});
// load remote content
dialog.load(
url,
{}, // omit this param object to issue a GET request instead a POST request, otherwise you may provide post parameters within the object
function (responseText, textStatus, XMLHttpRequest) {
// remove the loading class
dialog.removeClass('loading');
}
);
//prevent the browser to follow the link
return false;
});
});
</script>
</body>
</html>
请注意，您无法从本地加载远程内容，因此您必须将其上传到服务器或其他地方。另请注意，您无法从外部域加载，因此您应该将链接的 href 替换为同一域(和 here's the workaround )上托管的文档。
干杯
关于在 AJAX 风格 jQuery UI 选项卡中加载的 jQuery UI 对话框窗口，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/809035/