Переключить контент Div onclick

Question

У меня есть два divs - каждый с одним изображением внутри. Если я нажимаю на изображение внутри второго div, я хочу, чтобы это изображение стало содержимым первого div (например, галереи).

Важно, чтобы я не заменял ссылки внутри тега img, поэтому document.IMG1name.src = document.IMG2name.src не является возможным.

Я попробовал его с innerhtml, но он не работает:

<div id="container1"> 
<img src="blablabla"> 
</div> 

<div id="container2"; onclick="document.getElementById('container1').innerHTML=document.getElementById('container2').innerHTML"><img src="../funnycat.jpg"> 
</div> 

Answer 1

мм ... ваш код работает отлично, просто закрыть IMG теги и удалить точку с запятой:

<div id="container1"> 
    <img src="blablabla" /> 
</div> 

<div id="container2" onclick="document.getElementById('container1').innerHTML=document.getElementById('container2').innerHTML"><img src="https://www.google.es/logos/doodles/2013/holiday-series-2013-3-4504416610680832-hp.jpg" /> 
</div> 

здесь у вас есть демо: http://jsfiddle.net/HLs86/

Answer 2

HTML

<div class="pricing_table" id="monthly"> 
<ul> 
<li>Basic</li> 
<li><a href="" class="buy_now">Subscribe Now</a></li> 
</ul> 
    <ul style="background-color:#CCCCCC;"> 
    <h2>Monthly Plans</h2><a class='plansSwitch' href='#yearly'>Click here to switch to the "Yearly Plans"</a></ul> 
    </div> 
    <div class="pricing_table" id="yearly"> 
    <ul> 
<li>Basic</li> 
<li><a href="" class="buy_now">Subscribe Now</a></li> 
</ul> 
<ul style="background-color:#CCCCCC;"> 
<h2>Yearly Plans</h2><a class='plansSwitch' href='#monthly'>Click here to switch to the  "Monthly Plans"</a></ul> 
</div> 

JS

var $plansHolders = $('#monthly, #yearly').hide(); 
$('#monthly').show(); 
$('.plansSwitch').click(function() { 
var href = $(this).attr('href'); 
$plansHolders.hide(); 
$(href).show(); 
}); 

Answer 3

вам просто нужно добавить javascript: на вашем onclick действия, как это

<div id="container1"></div> 

<div id="container2" onclick="javascript:document.getElementById('container1').innerHTML=document.getElementById('container2').innerHTML"><img src="http://i.imgur.com/0fS8dCsb.jpg"/> 
</div> 

есть example