我有IFRAME加载onClick。
以下脚本的问题是始终加载第一个iframe的内容,而我期望在点击相对链接时加载JUST正确的iframe。
$('.toggle-next-div').click(function(){
var iframe = $("#myiFrame");
iframe.attr("src", iframe.data("src"));
});
HTML
<a href="#" class="toggle-next-div">Map</a>// iframe (1)
<iframe id="myiFrame" data-src="my-url" src="about:blank"></iframe
<a href="#" class="toggle-next-div">Map</a>// iframe (2)
<iframe id="myiFrame" data-src="my-url" src="about:blank"></iframe>
<a href="#" class="toggle-next-div">Map</a>// iframe (3)
<iframe id="myiFrame" data-src="my-url" src="about:blank"></iframe
<a href="#" class="toggle-next-div">Map</a>// iframe (and so on...)
...
如何只加载相对链接的iframe?
答案 0 :(得分:2)
不要使用相同的ID。你可以使用一个类:
<a href="#" class="toggle-next-div">Map</a>// iframe (1)
<iframe class="myiFrame" data-src="my-url" src="about:blank"></iframe>
<a href="#" class="toggle-next-div">Map</a>// iframe (2)
<iframe class="myiFrame" data-src="my-url" src="about:blank"></iframe>
$('.toggle-next-div').click(function(e) {
e.preventDefault();
var iframe = $(this).next();
iframe.attr("src", iframe.attr("data-src"));
});