顯示內容僅供點擊DIV

Question

我有這樣的：

<div class="wrapper"> 
    <div class="left1"> 
    <div id="position" style="background-color:yellow;border:1px solid black;display:none;width:200px;height:200px;"class="PopupDiv";>Position 1<br>Price x<br>Available on xx-xx-xx<br><a href="http://flibay.com/buy.php";>Buy;</a></div> 
      <a href="#" onclick="Popup.show('position','reference','center center',{'constrainToScreen':true});;return false;">Details;</a><br> 
     <img src="img/banner_1.jpg"> 
    </div> 
    <div class="left2"> 
    <div id="position" style="background-color:yellow;border:1px solid black;display:none;width:200px;height:200px;"class="PopupDiv";>Position 2<br>Price x<br>Available on xx-xx-xx<br><a href="http://flibay.com/buy.php";>Buy;</a></div> 
      <a href="#" onclick="Popup.show('position','reference','center center',{'constrainToScreen':true,'offsetTop':-200});;return false;">Details;</a><br> 
     <img src="img/banner_1.jpg"> 
    </div> 
    <div class="left3"> 
    <div id="poistion" style="background-color:yellow;border:1px solid black;display:none;width:200px;height:200px;"class="PopupDiv";>Position 3<br>Price x<br>Available on xx-xx-xx<br><a href="http://flibay.com/buy.php";>Buy;</a></div> 
      <a href="#" onclick="Popup.show('position','reference','center center',{'constrainToScreen':true,'offsetTop':-200});;return false;">Details;</a><br> 
     <img src="img/banner_1.jpg"> 
    </div> 
    <div class="left4"> 
    <div id="position" style="background-color:yellow;border:1px solid black;display:none;width:200px;height:200px;top:50%;left:50%;margin:-(height/2)px 0 0 -(width/2)px;"class="PopupDiv";>Position 4<br>Price x<br>Available on xx-xx-xx<br><a href="http://flibay.com/buy.php";>Buy;</a></div> 
      <a href="#" onclick="Popup.show('position','reference','center center',{'constrainToScreen':true,'offsetTop':-200});;return false;">Details;</a><br> 
     <img src="img/banner_1.jpg"> 
    </div> 
    <div class="left5"> 
    <div id="position" style="background-color:yellow;border:1px solid black;display:none;width:200px;height:200px;"class="PopupDiv";>Position 5<br>Price x<br>Available on xx-xx-xx<br><a href="http://flibay.com/buy.php";>Buy;</a></div> 
      <a href="#" onclick="Popup.show('position','reference','center center',{'constrainToScreen':true,'offsetTop':-200});;return false;">Details;</a><br> 
     <img src="img/banner_1.jpg"> 
    </div> 
    <div class="left6"> 
    <div id="position" style="background-color:yellow;border:1px solid black;display:none;width:200px;height:200px;"class="PopupDiv";>Position 6<br>Price x<br>Available on xx-xx-xx<br><a href="http://flibay.com/buy.php";>Buy;</a></div> 
      <a href="#" onclick="Popup.show('position','reference','center center',{'constrainToScreen':true,'offsetTop':-200});;return false;">Details;</a><br> 
     <img src="img/banner_1.jpg"> 
    </div> 
</div> 

這是格爲中心的JavaScript彈出窗口，但如果我點擊其中任何6周的div的，拿在彈出onlu ID爲「位置」的內容第一個div 。怎樣才能得到我點擊的那些div的內容？ P.S從這個鏈接 Javacript popup.js我修改http://www.javascripttoolbox.com/libsource.php/popup/combined/popup.js

Answer 1

您使用您所有的div相同id。一個id必須在整個文檔中是唯一的。

<div id="position" style="background- ..snip... 
      ^^^^^^--- each of these MUST be unique. 

嘗試重命名這些position1，position2，等...

ID重複，使一個無效的文件，和的getElementById（）是不會通過返回所有匹配的元素來彌補你的錯誤。它會（正確地）假設ID應該是唯一的，並且只返回FIRST匹配元素。