Это мой шорткод из 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 вместо классов в списке, что заставляет меня думать, что у вас возникнут проблемы при добавлении большего количества элементов списка.
Чтобы упростить задачу, <span data-tag="onoff" class="clickMe">
для первой ссылки изображения и <span data-tag="delete" class="clickMe">
для второго. Затем вы можете легко пропустить что-то вроде:
$('.clickMe').click(function() {
alert($(this).data('tag'));
});
$(this).find('img').click()
?