用另一个div jQuery的内容替换Div的内容 [英] Replace content of Div with content of another div jQuery
本文介绍了用另一个div jQuery的内容替换Div的内容的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想通过单击图像将div的内容替换为另一个div(使用css隐藏)的内容。然而,使用这里建议的一些方法我似乎无法使其工作。
I would like to replace the content of a div with the contents of another div (which is hidden using css) by clicking on an image. However using a few methods suggested on here I can't seem to get it working.
我的代码如下:
html
<h3>Recent Callaborations</h3>
<div id="collaborations">
<img class="rec1" src="http://domain.com/michaelscott/wp-content/uploads/2013/02/url.png"/>
<div id="rec1">Some image caption that is hidden now and that will replace what is in the rec div below</div>
</div>
<div id="rec-box" class="rec">
this is the content that is to be replaced
</div>
js
jQuery(document).ready(function() {
jQuery(".rec1").click(function(event) {
event.preventDefault()
jQuery('#rec-box').html($(this).next('#rec1')[0].outerHTML);
});
});
css
#collaborations {
width: 100%;
margin:0 0 10px 0;
padding:0;
}
#collaborations img {
display:inline-block;
}
.rec {
background: #EDEDED;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
padding: 10px;
}
#rec1, #rec2, #rec3, #rec4 {
display:none;
}
推荐答案
你只需要设置 html()
正确的 div
。试试这个:
You simply need to set the html()
of the correct div
. Try this:
jQuery(document).ready(function() {
jQuery(".rec1").click(function(event) {
event.preventDefault()
jQuery('#rec-box').html(jQuery(this).next().html());
});
});
这篇关于用另一个div jQuery的内容替换Div的内容的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文