Question

使用jQuery，我只是在鼠标点击图片或周边区域时尝试获取href的{{1}}。

HTML模板：

样式：

<nav id="main_nav">
  <ul>
    <li>
      <a href="/" data-path>
        <img class="dashboard_icon" src="img/icons/nav/dashboard.svg">
      </a>
    </li>
  </ul>
  ... more nav options
</nav>

jQuery的：

li { list-style: none; display: block; width: 80px; height: 80px; }
a { display: block; width: 100%; height: 100%; }
img { width: 30px; height: 30px; margin: 25px; }

但问题是，每当我点击$(document).on('click', '[data-path]', (e) => { e.preventDefault(); let target = $(e.target).attr('href'); router.navigate(target); });内的图片时，我都没有得到a，因为它试图从href获取href值我点击的图片而不是a。但是，如果我点击图片周围的区域，我会根据需要获得href。

尝试：

我改变了：

let target = $(e.target).attr('href');

要：

let target = $(this).attr('href');

但点击图片或周边区域时绝对没有任何意义！

我做错了什么？我无法相信我会就这样简单的问题提出问题，但我只花了一年的时间编写代码，而且我显然错过了一些重要的事情，而且让我感到莫名其妙

我希望能够点击a中的所有内容并获取href的{{1}}。

Answer 1

你可以尝试e.currentTarget，这将获得事件绑定的元素，e.target将获得实际点击的元素。

Answer 2

这可能会让你开始：

$(document).on('click', '#main_nav a', function(e) {
   e.preventDefault();
   let target = $(this).attr('href'); 
   alert(target)
});

请参阅jsFiddle Demo

Answer 3

使用jquery应该是：

.Select(c => c).Distinct()

不使用jquery，这将是：

$(this).parent().attr('href');

完整的代码是：

this.parentNode.getAttribute("href")

图片是锚标签的子项，当你点击图片时需要得到他的父母，所以这样就完成了。

演示：https://jsfiddle.net/ask3a4gf/

Answer 4

尝试：var href = event.toElement.parentElement.href;

Answer 5

您的问题来自使用箭头功能而不是.rb

将function(e)更改为(e) => {并使用function(e) {

引自mozilla -

arrow function expression 的语法短于函数表达式并没有自己的这个

获取点击链接的href与里面的图像

5 个答案: