javascript - jQuery ID 选择和动态数组

Question

我有一些代码正在苦苦挣扎。好消息是代码按预期为单个实例工作；经过一番思考，我决定在一个页面上使用多个这样的图像选择器。这行得通，但是复制代码的丑陋方法不能很好地扩展(例如，如果你想要其中的 50 个怎么办？)我遇到的问题是如何引用特定的数组。数组是这个问题的理想解决方案吗？

目标

我有一系列图像可供用户选择，最多 X 数量。选定的图像 ID 存储在数组中，图像被添加到“选定图像池”。这是通过对 slider 使用 onClick 发生的，我从元素属性中获取 Id。这就是我卡住的地方。

var dataArray = $(this).closest("[id^=carousel]").data('array');
var slideCounter = $(this).closest("[id^=carousel]").data('counter');
slideCounter = dataArray.length;

slideCounter 返回字符串的长度，而不是数组元素。我怎样才能告诉这段代码引用一个特定的数组？请参阅 fiddle 以更好地了解标记和代码:jsFiddle

我毫不怀疑有更好的方法。我是前端工作的新手，如果有任何见解，我将不胜感激，为此我已经消耗了一些脑细胞，谢谢!

Answer 1

从您的 HTML 来看，您这样做时看起来像:

var dataArray = $(this).closest("[id^=carousel]").data('array');

您要做的是使用 .data() 读取数组的名称，然后以某种方式将该名称(它是一个字符串)转换为变量中的数组。我的猜测是，可能有更好的方法来构建代码，而不是将 javascript 变量名放在 HTML 中。我可能会在 HTML 中放置一个键名，然后将数组存储在一个对象中，您可以随时通过该键名访问它们。

在不尝试重构您的代码的情况下，这里是您尝试完成的想法:

如果 selectedSlidesIdArray1 是一个全局变量，那么你可以这样做:

var dataArray = window[$(this).closest("[id^=carousel]").data('array')];

在对象上使用 [stringVariable] 表示法，可以让您通过文字字符串或包含字符串的变量访问属性。由于所有全局变量也是 window 对象的属性，因此您可以对全局变量这样做。

如果 selectedSlidesIdArray1 不是全局变量，那么您可能应该将它放在一个对象中，然后您可以这样做:

var dataArray = yourObj[$(this).closest("[id^=carousel]").data('array')];