Jquery 单击div后显示iframe

我有一个

div

，它通过CSS包含一个图像src，我想在单击div中的图像时显示一个

iframe

。通过在iframe周围包装一个标记并使用jQuery编写一个click函数，我能够成功地在一个简单的文本值上显示iframe。但是，我无法将其用于

div

中的图像。如何在我的

div

中调用jQuery函数？我的

div

中是否需要

onclick

事件

$（文档）.ready（函数（）{
$（“#容器”）。单击（功能（e）{
e、 预防默认值（）；
$（“brand”）.attr（“src”），$（this.attr（“href”）；
})
});
.containerA{
宽度：140px；
高度：99px；
}
.containerA:悬停{
背景：url（“img/imageB_05.jpg”）无重复；
背景尺寸：包含；
}
.imageA:悬停{
不透明度：0；
}

//div#containerA没有HREF属性，因为它不是一个A标记

//这需要是#品牌，$（此）指向没有href值的#containerA

<div class="containerA" id="containerA" style="width: 140px; height: 99px">
   <a href="http://something.com">Something</a>
</div>


$(document).ready(function() {
   $("#containerA").click(function(e) {
     e.preventDefault();
     $("#brand").attr("src", $('#containerA a').attr("href"));
  })
});


$（文档）.ready（函数（）{
$（“#容器”）。单击（功能（e）{
e、 预防默认值（）；
$（“#brand”）.attr（“src”），$（“#containerA a”）.attr（“href”）；
})
});
jQuery/JavaScript甚至CSS都不需要
更改

要求
指向您希望
指向的站点的
[href]
的链接


该链接还需要一个
[target]
属性。为它指定
的
[name]
属性（请参阅下一步）


请参见演示1


还有一个jQuery版本，请参见演示2


演示1

.containerA{
宽度：70vw；
高度：30vh；
轮廓：1px红色虚线；
}
a.集装箱{
背景重复：无重复；
背景位置：中心；
背景尺寸：包含；
显示：内联块；
身高：100%；
宽度：30%；
文字装饰：无；
转变：不透明度1.2s；
不透明度：0；
}
a:悬停{
过渡：不透明度0.75；
不透明度：1；
}
a:第一种{
背景图片：url(https://i.ibb.co/5LPXSfn/Lenna-test-image.png);
}
a：第n种类型（2）{
背景图片：url(https://i.ibb.co/ZHvWsKb/o1z7p.jpg)
}
a:最后一种{
背景图片：url(https://i.ibb.co/tmQZgJb/68eb2df1a189f88bb0cbd47a3e00c112.png)
}
iframe{
宽度：70vw
}


$（文档）.ready（函数（）{
$（“#容器”）。单击（功能（e）{
e、 预防默认值（）；
//使用iframe id作为选择器
$（“#brand”）.attr（“src”），$（“#containerA a”）.attr（“href”）；
})
});
.containerA{
宽度：140px；
高度：99px；
}
.containerA:悬停{
背景：url（“img/imageB_05.jpg”）无重复；
背景尺寸：包含；
}
.imageA:悬停{
不透明度：0；
}
我不知道是谁投了反对票。。。但是如果你添加一个片段，我会把它作为一个好的答案。。。
<a href="https://example.com" target="brand"></a>

<iframe name="brand"></iframe>