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>

这是以div为中心的javascript弹出窗口，但是如果我点击了这6个div中的任何一个，请在弹出的内容中首先使用ID＆＃34; position＆＃34;进行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匹配元素。

在弹出窗口中仅显示单击的div显示内容

1 个答案: