Jquery:如何从具有相同类名的多个iframe中加载特定的iframe

Question

我有一个简单的html页面，当你点击它时，它有多个按钮，iframe将从jquery脚本加载。

我的函数正在运行，但我想加载一个特定的iframe，我点击它，它会加载所有iframe。

这是我的片段。

Html(按钮列表(

<div id="mydiv">
<iframe class="frame"  width="100%" height="300">
</iframe>
</div>
<button class="button">Load</button>

<div id="mydiv">
<iframe class="frame"  width="100%" height="300">
</iframe>
</div>
<button class="button">Load</button>

Css(隐藏我的iframes(

<style>
iframe{
display: none;
}
</style>

脚本(jquery函数，点击加载并显示iframe时运行(

$(".button").click(function () {
$(".frame").attr("src", "https://www.bing.com/");
$('iframe').css('display', 'block');
});

请帮助我的社区。

Answer 1

您必须确定代码的范围以更新正确的iframe元素，而不是全部更新。你可以做一些类似的事情：

$(".button").click(function () {
var currentIframe = $(this).prev().find("iframe");
currentIframe.attr("src", "https://www.bing.com/");
currentIframe.css('display', 'block');
});