传递Jquery对象以使其不适用于IMG

时间:2015-06-11 10:49:04

标签: javascript jquery html

我想将Jquery对象传递给函数,但它不适用于IMG标记。

我在下面做了一个例子。当我点击文字时它会起作用,但当我点击图片时它不起作用。



$(document).on('click','.playvid',function (event) {
    event.stopPropagation();
    popup($(event.target));
}); 
function popup(data)
{
    data.html("success");   
}

.playvid 
{
    cursor:pointer;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div data-id="3ZdHRvPNyCI" class=" playvid" ><img src="https://cdn4.iconfinder.com/data/icons/iconset-addictive-flavour/png/button_green_play.png">WATCH DEMO</div>
&#13;
&#13;
&#13;

3 个答案:

答案 0 :(得分:5)

问题是因为,根据您点击的位置,event.target可以是img元素,但不能包含html。相反,将$(this)传递给您的函数,因为它将包含.playvid元素:

&#13;
&#13;
$(document).on('click', '.playvid', function(event) {
  event.stopPropagation();
  popup($(this));
});

function popup(data) {
  data.html("success");
}
&#13;
.playvid {
  cursor: pointer;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div data-id="3ZdHRvPNyCI" class="playvid">
  <img src="https://cdn4.iconfinder.com/data/icons/iconset-addictive-flavour/png/button_green_play.png">
  WATCH DEMO
</div>
&#13;
&#13;
&#13;

答案 1 :(得分:2)

您可以通过class -

简单地传递对象
popup($('.playvid'));

对于多个.playvid类 -

popup($(this));

答案 2 :(得分:0)

$(document).on('click','.playvid',function (event) {
  event.stopPropagation();

 popup($(event.currentTarget));

    }); 

其中currentTarget始终是具有'.playvid'作为规则的所有对象的最后一个变形对象。