加载IFRAME onClick [英] Load IFRAME onClick

问题描述

我有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 =myiFramedata-src = my-urlsrc =about：blank>< / iframe 
< a href =＃class =toggle-next-div> Map< / a> // iframe 2）
< iframe id =myiFramedata-src =my-urlsrc =about：blank>< / iframe> 
< a href =＃class =toggle-next-div> Map< / a> // iframe（3）
< iframe id =myiFramedata-src = my-urlsrc =about：blank>< / iframe 
< a href =＃class =toggle-next-div> Map< / a> // iframe等等...）
 ... 
  

如何加载iframe相对的链接？

解决方案

不要使用相同的ID。你可以使用一个类：

 < a href =＃class =toggle-下一个div>映射< / a> // iframe（1）
< iframe class =myiFramedata-src =my-urlsrc =about：blank><的iframe> 
< a href =＃class =toggle-next-div> Map< / a> // iframe（2）
< iframe class =myiFramedata-src = my-urlsrc =about：blank>< / iframe> 
  

< pre $ $（'。toggle-next-div'）。click（function（e）{
e.preventDefault（）;
var iframe = $（this ）.next（）;
iframe.attr（src，iframe.attr（data-src））;
}）;


I have IFRAMEs loading onClick.

The problem with the following script is that always loads the content of the first iframe, while I'm expecting to load JUST the right iframe when I click on the relative link.

$('.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...)
...

How to load just the iframe for the relative link?

解决方案

Don't use the same ID. You can use a class:

<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")); 
});

这篇关于加载IFRAME onClick的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！