如何从jquery ui模式对话框小部件内部的外部URL动态加载内容? [英] How to dynamically load content from an external url, inside of a jquery ui modal dialog widget?
问题描述
之前我问过这个问题,但我认为我没有正确解释我想要完成的事情。
I asked this question before, but I don't think I explained properly for what I am trying to accomplish.
我的网站上有多个链接,我想在jquery ui模式对话框小部件中打开链接中的内容。
There are multiple links on my website and I want to open the content from the link in a jquery ui modal dialog widget.
我正在尝试使用'this'来引用用户动态选择的链接。
我在这里做错了什么?
I'm trying to use 'this' to reference the link that the user selects dynamically. What am I doing wrong here?
我正在使用的代码如下:
The code I'm using is below:
<a href="index.cs.asp?Process=comments&id=1" id="test">comment #1</a>
<a href="index.cs.asp?Process=comments&id=2" id="test">comment #2</a>
<a href="index.cs.asp?Process=comments&id=3" id="test">comment #3</a>
<div id="somediv"></div>
<script type="text/javascript">
$(document).ready(function() {
$("#somediv").load(this.getTrigger().attr("href")).dialog({
autoOpen: false,
width: 400,
modal: true
});
$("#test").click(function(){$( "#somediv" ).dialog( "open" );});
});
</script>
推荐答案
一些变化:将ID更改为Class并使用IFrame。
A couple changes: changed ID to Class and used IFrame.
<a href="http://wikipedia.com/" class="test">comment #1</a><br>
<a href="http://ebay.com/" class="test">comment #2</a><br>
<a href="http://ask.com/" class="test" >comment #3</a><br>
<div id="somediv" title="this is a dialog" style="display:none;">
<iframe id="thedialog" width="350" height="350"></iframe>
</div>
<script>
$(document).ready(function () {
$(".test").click(function () {
$("#thedialog").attr('src', $(this).attr("href"));
$("#somediv").dialog({
width: 400,
height: 450,
modal: true,
close: function () {
$("#thedialog").attr('src', "about:blank");
}
});
return false;
});
});
</script>
如果你想引入HTML而不是IFrame,你将不得不使用Ajax(XMLHttpRequest) ),像这样: http://jsfiddle.net/qp7NP/1/
In case you want to pull in the HTML instead of IFrame, you will have to use Ajax (XMLHttpRequest), something like this: http://jsfiddle.net/qp7NP/1/
这篇关于如何从jquery ui模式对话框小部件内部的外部URL动态加载内容?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!