jQuery访问列表视图->ul->李->span->img

jQuery accessing listview->ul->li->span->img

本文关键字：gt span- img ul- 访问 jQuery 列表 视图      更新时间：2023-09-26

这是我对li的缩写。

<li>
    <a href='#'><img src='img.png'/>
        <h2 style='margin-top: 0px; padding-top: 0px'>test</h2>
        <p><strong>{</strong><label>test</label><strong>}</strong></p>
        <p><strong>test</strong></p>
        <p><strong style='font-size: 17px; color: #fff'>10</strong>
        <br/><span id='onoff'><img src='on.png'/></span>
        <span id='delete'><img src='abc.png'/></span></p>
    </a>
</li>

正如您所看到的，li在整个html中包含一个<a href>，它将在单击时触发一个文件。也就是说，我想检测span内部图像的点击，这两个图像分别是<span id='onoff'>和<span id='delete'>

这就是我迄今为止所尝试的，但没有任何结果。

$('#page-main-listview ul li span').on("click", function(){
    if(($this).attr("id") == 'onoff'){
        // I dont know what to put here
        // I need to find img now and trigger 'onClick()'
    }
});

编辑：我想我已经解决了这个问题，通过这种方式：

$('#page-main-listview').delegate('img', 'click', function(){
    $atrr = $(this).attr("name");
    alert($atrr);
    if($atrr == 'on'){
    }
});

您在列表中使用的是span ID而不是类，这让我相信在添加更多列表元素时会遇到问题。

为了更容易，<span data-tag="onoff" class="clickMe">用于第一个图像链接，<span data-tag="delete" class="clickMe">用于第二个图像链接。然后你可以很容易地循环通过类似的东西：

$('.clickMe').click(function() {
    alert($(this).data('tag'));
});
相关文章：