为什么'attr'只适用于第一个元素

时间:2015-08-20 16:53:30

标签: jquery

我有一个简单的功能:取决于是否点击了一个按钮,如果attr发生这种情况,我会存储。

行为是:首先单击任何项​​目列表,然后单击“Item1”或“Item2”。 如果已单击任何项​​目列表,则背景必须更改为红色。否则必须变为粉红色。

它似乎有用,但是当我尝试测试它时,只有在点击的项目列表是第一个时才有效。

还使用this question上的data()进行了尝试,但使用了same result

我用'hasClass'实现了我想要的东西,但我不知道我的功能有什么问题。为什么这只适用于dataattr的第一个元素?

	$("footer ul li").on("click", function() {
		$(this).attr('data-clicked', 'true');
	  });




	$("dl dt").click( function () {
		if ($("footer ul li").attr("data-clicked")) {
			$("body").css("background", "red");
		} else {
			$("body").css("background", "pink");
		};
	});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<footer>
<ul>
    <li id="#foo">Item list 1</li>
    <li id="#bar">Item list 2</li>
</ul>

<dl>
<dt>Item 1</dt>

    <dd>Description 1</dd>
<dt>Item 2</dt>

    <dd>Description 2</dd>
</dl>
    </footer>

1 个答案:

答案 0 :(得分:3)

在这种情况下,请参阅手册/文档。如jQuery API documentation on .attr()中所述:

  

获取匹配元素集中第一个元素的属性值,或为每个匹配元素设置一个或多个属性。

.data()也不例外:

  

存储与匹配元素关联的任意数据,或者在匹配元素集中的第一个元素的指定数据存储中返回值。