问题描述
AJAX 选项卡运行良好.这部分非常简单.但是，让 AJAX UI Dialog 模式窗口触发链接并不成功.
The AJAX tabs work perfectly well. It's pretty straightforward with that part. However, getting the AJAX UI Dialog modal window to trigger off of a link has been unsuccessful.
我们将不胜感激.
推荐答案
没有什么比那个人更容易的了.试试这个:
Nothing easier than that man. Try this one:
<?xml version="1.0" encoding="iso-8859-1"?>
<html>
<head>
<script src="http://ajax.googleapis/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css" type="text/css" />
<script src="http://ajax.googleapis/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">
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 替换为托管在同一域上的文档(以及 这是解决方法).
Note that you can't load remote from local, so you'll have to upload this to a server or whatever. Also note that you can't load from foreign domains, so you should replace href of the link to a document hosted on the same domain (and here's the workaround).
干杯
这篇关于在 AJAX 样式 jQuery UI 选项卡中加载的 jQuery UI 对话框窗口的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
更多推荐
[db:关键词]
发布评论