我在弹出窗口显示用户单击的最后一个元素而不是当前元素时遇到问题。我有几个不同的优惠券,用户可以点击打印。例如,如果用户单击 id 为“test”的优惠券,则不会发生任何事情,但当用户再次单击时,优惠券会出现。在这种情况下,无论点击哪个优惠券,“测试优惠券”都会继续出现。如果页面是手动刷新的,那么用户可以点击一个新的优惠券。我究竟做错了什么?
$(".coupon").click(function() {
var id = $(this).attr("id");
$('.pop').popupWindow({
windowURL:'coupons/' + id + '.html'
});
});
.coupon {
margin:10px;
height:152px;
width:193px;
position:relative;
cursor:pointer;
float:left;
}
.coupon .price {
margin-top:7px;
font-size:29px;
font-weight:bold;
color:white;
text-align:center;
}
.coupon .title {
margin-top:5px;
font-size:18px;
font-weight:bold;
color:black;
text-align:center;
font-family:'Times New Roman',Georgia,Serif;
}
<div class="coupon pop" id="test1">
<div class="price">
$5.00 OFF
</div>
<div class="title">
Test
</div>
</div>
<div class="coupon pop" id="test2">
<div class="price">
$5.00 OFF
</div>
<div class="title">
Another test
</div>
</div>