javascript - 使用 Javascript onClick 事件转到子元素的 href

Question

由于一些怪异，我坚持使用 javascript 到 Jquery 通过单击父 li 元素来获取工作链接。基本上单击li上的任何位置都应该将用户带到它的直接子a的链接。我所拥有的一些东西似乎不起作用。编码：

<ul>
<li onclick="location.href='$(this).children('a:first').attr('href')';">
    <a href="http://example.com/">link</a>
    </li>
    </ul> 

谢谢！

Answer 1

您可以通过不使用 onclick 移动来简化代码，而是使用选择器来定位该节点并在那里有一个 click 事件。

$(".myUl li").on("click", function() {
    location.href = $(this).children("a").attr("href");
});

但是你真的应该通过使用 css 来解决这个问题。您也可以display: block;在 上使用<a>，并让它填充内容，添加额外的填充，基本上表现得像一个 div，但保留链接功能。

Answer 2

当您在 href 周围加上单引号时，它被视为一个字符串。此外，您在其他单引号中使用了单引号，这会提前结束字符串。它实际上会尝试访问 URL“$(this).children(”。

相反，删除 location.href 周围的单引号

<ul>
    <li onclick="location.href=$(this).children('a:first').attr('href');">
        <a href="http://example.com/">link</a>
    </li>
</ul> 

此外，您真的不应该使用这样的内联脚本。最好在页面底部添加一个脚本标签，并在其中放置一个绑定到 li 的点击事件的脚本。

Answer 3

用这个代替

    <li onclick="location.href=$(this).children('a:first').attr('href');">