单击其中的链接图像不会记录

Question

我有两个具有不同结构的链接。

<div id="content">    
 <a href="javascript:void(0)" data-uri="https://stackoverflow.com/questions/ask">

和

 <a href="javascript:void(0)" data-uri="https://stackoverflow.com/questions/ask">
  <img src="https://www.gravatar.com/avatar/084f45fb1ccb4bd208ad48dbffcd502f?s=48&d=identicon&r=PG">
 </a>
</div>

我有这个函数，应该通过单击<a>元素来记录data-uri。

var clickHandler = "click";

if ('ontouchstart' in document.documentElement) {
    clickHandler = "touchstart";
}

$(document).on(clickHandler, '#content a', function() {
        href = $(this).data("uri");
        console.log(href);
});

出于某种原因，与图像的链接不起作用。什么都没有记录。

PS。如果具有触摸功能的移动设备查看页面，则clickHandler变量适应。

Answer 1

我认为这应该有效

删除这部分

if ('ontouchstart' in document.documentElement) {
 clickHandler = "touchstart";
} 

并添加此

$(document).on('touchstart click', 'a#content', function(event){

根据答案

How to bind 'touchstart' and 'click' events but not respond to both?

Answer 2

对我来说很好。

你可以通过这个：http://jsfiddle.net/PpXz5/4/

代码：

$("#content a").on("click", function() {
        href = $(this).data("uri");
        console.log(href);
});