javascript - 属性符合我的值(value)

Question

我想创建一个具有名称、类和 ID 的可点击图像，如果我单击该图像，它应该显示该图像的 ID，而不使用数据库或帖子。例如:

<div class='widget-content' style="min-height: 300px;">  
       <img src="images/icons/running.jpg" 
        id="runningDrop"
        class="droplink" />
       <img src="images/icons/swimming.jpg" 
         id="swimmingDrop"
         class="droplink" />
 </div>

如果我点击其中一张图像，它应该显示 id swimmingDrop 或 runningDrop。

Answer 1

简单地onclick =“alert(this.id)”

<div class='widget-content' style="min-height: 300px;">  
       <img src="images/icons/running.jpg" 
        id="runningDrop"
        class="droplink" 
        onclick="alert(this.id)"/>
       <img src="images/icons/swimming.jpg" 
         id="swimmingDrop"
         class="droplink" 
         onclick="alert(this.id)"/>
 </div>

正如我在评论中所说，当你标记jquery时，这是jquery解决方案

$('img').on('click', function(){ alert($(this).attr('id')) });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='widget-content' style="min-height: 300px;">  
       <img src="images/icons/running.jpg" 
        id="runningDrop"
        class="droplink"/>
       <img src="images/icons/swimming.jpg" 
         id="swimmingDrop"
         class="droplink"/>
 </div>