Javascript 如何'；加入'；并在jQuery中循环2个关联数组？

我有15个部分（称为基本部分），每个部分都有自己的一组字母按钮

我所要做的就是将字母数字与它们所在的基本/部分相关联。因此，例如，如果用户单击base 7下的字母“B”，我想返回用户已单击base

7下的字母
B

我将所有需要的数据放入2个数组，并动态生成字母表。一切正常，但我无法将字母与底座联系起来

您可以查看下面的演示，打开控制台日志并尝试单击任何按钮

这是到目前为止我的代码

正如您将看到的，我试图从第二个字母表循环中的第一个
forEach
循环返回
base[I].id

console.log(alphabet[i].id + ' has been clicked on ' + base[i].id);

这将返回以下结果

A has been clicked on base1
B has been clicked on base2
C has been clicked on base3

但他们都应该说是在base7上，因为按钮就在那里

更重要的是，下面的代码应该绑定这两个数组，因为它要求应用纹理的
base
name/number

setMaterialUIDPending (base[i].name, AlbedoPBR, alphabet[i].id+"-letter");

我希望我说得有道理


let base=[
{'id'：'base1'，'btn'：'b1 include'，'name:'baseone'}，
{'id'：'base2'，'btn'：'b2 include'，'name:“basetwo”}，
{'id'：'base3'，'btn'：'b3 include'，'name:'basethree'}，
{'id'：'base4'，'btn'：'b4 include'，'name:'basefour'}，
{'id'：'base5'，'btn'：'b5 include'，'name:'basefive'}，
{'id'：'base6'，'btn'：'b6 include'，'name:'basesix'}，
{'id'：'base7'，'btn'：'b7 include'，'name:'baseseven'}，
{'id'：'base8'，'btn'：'b8 include'，'name:'baseeight'}，
{'id'：'base9'，'btn'：'b9 include'，'name:'basenine'}，
{'id'：'base10'，'btn'：'b10 include'，'name:'baseten'}，
{'id'：'base11'，'btn'：'b11 include'，'name:'base11'}，
{'id'：'base12'，'btn'：'b12 include'，'name:'base12'}，
{'id'：'base13'，'btn'：'b13 include'，'name:'base13'}，
{'id'：'base14'，'btn'：'b14 include'，'name:'base14'}，
{'id'：'base15'，'btn'：'b15 include'，'name:'base15'}，
];
让字母表=[
{“id”：“A”，“url”：”https://example.com/A.png" },
{“id”：“B”，“url”：”https://example.com/B.png" },
{“id”：“C”，“url”：”https://example.com/C.png" }
];
让预览=$（'.preview'）；
$。每个（基础、功能（i、v）{
设$collapse=$（“”，{'class'：'collapse'，id:base[i].id}）；
设$btn=$（'















您在两个
$中使用相同的迭代变量
i
和
v
。每个
循环。因此，当您在
字母表上循环时，
base[i]
使用
字母表中的索引，而不是
base
中的索引。您应该使用不同的变量

正如我在评论中提到的，您不需要为数组编制索引，这就是使用
$的要点。每个
——回调参数是数组的当前元素。因此，只需在每个数组中使用比
v
更独特的名称即可


let base=[
{'id'：'base1'，'btn'：'b1 include'，'name:'baseone'}，
{'id'：'base2'，'btn'：'b2 include'，'name:“basetwo”}，
{'id'：'base3'，'btn'：'b3 include'，'name:'basethree'}，
{'id'：'base4'，'btn'：'b4 include'，'name:'basefour'}，
{'id'：'base5'，'btn'：'b5 include'，'name:'basefive'}，
{'id'：'base6'，'btn'：'b6 include'，'name:'basesix'}，
{'id'：'base7'，'btn'：'b7 include'，'name:'baseseven'}，
{'id'：'base8'，'btn'：'b8 include'，'name:'baseeight'}，
{'id'：'base9'，'btn'：'b9 include'，'name:'basenine'}，
{'id'：'base10'，'btn'：'b10 include'，'name:'baseten'}，
{'id'：'base11'，'btn'：'b11 include'，'name:'base11'}，
{'id'：'base12'，'btn'：'b12 include'，'name:'base12'}，
{'id'：'base13'，'btn'：'b13 include'，'name:'base13'}，
{'id'：'base14'，'btn'：'b14 include'，'name:'base14'}，
{'id'：'base15'，'btn'：'b15 include'，'name:'base15'}，
];
让字母表=[
{“id”：“A”，“url”：”https://example.com/A.png" },
{“id”：“B”，“url”：”https://example.com/B.png" },
{“id”：“C”，“url”：”https://example.com/C.png" }
];
让预览=$（'.preview'）；
$。每个（基，函数（i，cur_基）{
让$collapse=$（“”，{'class'：'collapse'，id:cur_base.id}）；
设$btn=$（'















无需在
$中使用
base[i]
和
alphabet[i]
。每个
循环。这就是那些循环中的
v
所在。在单击处理程序中，您可以使用
this.id
获取被单击对象的id，然后使用类似于
的内容。最近（'li'））.id
以获取父对象的id。我无法真正说出最终标记的结构，因此，它可能不是li。谢谢@Barmar！我非常感谢。