如何使用java-script和jquery为列表中重复单击的标签存储类名？
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何使用java-script和jquery为列表中重复单击的标签存储类名？相关的知识，希望对你有一定的参考价值。
我正在使用html，css和javascript创建一个记忆游戏，要求用户将一组牌相互匹配。当用户点击它们并将其存储在列表中时，我目前仍然在提取代表卡类型的卡类名称。当用户点击一张卡片时，我设法只存储了一个类名，但是当我尝试将其用于下一张卡并在列表中存储类名时，我失败了。我尝试使用for和while循环。这是我的代码：
卡片的HTML部分：
<li class="card">
<i class="car"></i>
</li>
<li class="card">
<i class="cat"></i>
</li>
<li class="card">
<i class="car"></i>
</li>
<li class="card">
<i class="cat"></i>
</li>
JavaScript部分：
for (var i=0, i<2, i++) {
$(".card").click(function() {
clickedList[i] = $(this).children().attr("class");
});
}
请注意，我已将clickedList作为全局数组。
我真正想做的事情如下：
- 单击一张卡并将其类名存储在clickedList [0]中
- 单击另一张卡并将其类名存储在clickedList中[1]
- 如果匹配与否，则比较clickedList [0]和clickedList [1]
答案
摆脱循环并使用index()索引元素
var clickedList={}
var $cards = $(".card").click(function() {
var cardIndex = $cards.index(this)
clickedList[cardIndex] = $(this).children().attr("class");
console.log(clickedList)
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li class="card">
<i class="car">car</i>
</li>
<li class="card">
<i class="cat">cat</i>
</li>
<li class="card">
<i class="car">car</i>
</li>
<li class="card">
<i class="cat">cat</i>
</li>以上是关于如何使用java-script和jquery为列表中重复单击的标签存储类名？的主要内容，如果未能解决你的问题，请参考以下文章
如何在 Odoo 11 中通过 do_action() java-script 方法显示 action_id