Laden iframes durch einen div mit verschachtelten divs klicken

Question

Ich habe einen SETOF divs mit verschachtelten Elementen

<div id="second-item" class="dock-item"> 
    <div class="website-name">Facebook.com</div> 
    <div class="website-screenshot"><img src="fb-thumb.png" /></div> 
    <div class="page-name">Facebook</div> 
</div> 
    <div id="third-item" class="dock-item"> 
    <div class="website-name">Mozilla.com</div> 
    <div class="website-screenshot"><img src="uwdt-thumb.jpg" /></div> 
    <div class="page-name">Mozilla</div> 
</div> 

Ich habe einen Iframe # frame1

<iframe id="frame1"></iframe> 

Wenn ein Benutzer klickt auf dem übergeordneten # zweit- item div, ich brauche den iframe # frame1 um facebook.com zu laden

Wenn ein Benutzer auf den Elternteil # divided item klickt, brauche ich den iframe # frame1 um mozilla.com

zu laden

Wie mache ich das?

habe ich versucht, in der divs # Second-Element hinzufügen und # dritten Punkt der followin Onclick aber es hat nicht funktioniert:

'Onclick = "frames [ 'frame1']. Location.href =' http://sitename.com '' '

Answer 1

Viele Wege führen nach Rom (Hier nur zwei Wege!).

<!-- points on first frame--> 
<div id="second-item" class="dock-item" onclick="window.frames[0].location.href='http://facebook.com'"> 
    <div class="website-name">Facebook.com</div> 
    <div class="website-screenshot"><img src="fb-thumb.png" /></div> 
    <div class="page-name">Facebook</div> 
</div> 
<!-- points on name --> 
<div id="third-item" class="dock-item" onclick="window.frames['frame1'].location.href='http://mozilla.com'"> 
    <div class="website-name">Mozilla.com</div> 
    <div class="website-screenshot"><img src="uwdt-thumb.jpg" /></div> 
    <div class="page-name">Mozilla</div> 
</div> 
<iframe id="frame1" name="frame1"></iframe> 

Die bessere Lösung:

<!-- points on id --> 
<div id="fourth-item" class="dock-item" onclick="document.getElementById('frame1').src='http://www.phpclasses.org';return false;"> 
    <div class="website-name">phpclasses.org</div> 
    <div class="website-screenshot"><img src="uwdt-thumb.jpg" /></div> 
    <div class="page-name">PhpClasses</div> 
</div>