javascript - jQuery .attr() 返回第一个(错误的)值？

Question

基本上我做了一个函数，当你点击 .menu 时在容器 #page 中打开一个页面现在我遇到的问题是它总是显示第一个.menu data-open="url/url.html".

让我用代码解释一下:

我有 2 个列表项:

<li class="menu" data-open="pages/home.html"><a href="#"><div class="wrap">HOME</div></a></li>
<li class="menu" data-open="pages/services.html"><a href="#"><div class="wrap">SERVICES</div></a></li>

我有这样的.click函数:

$("nav ul li.menu").click(function () {
    var url = $("nav ul li.menu").attr("data-open");
    console.log(url);
    loadPage(url)
});

现在无论我是否点击服务，该 url ALWAYS 都会从 FIRST 列表项返回。

这是一个动图:

Answer 1

您需要引用被点击的项目。使用:

var url = $(this).attr("data-open");

代替:

var url = $("nav ul li.menu").attr("data-open");