Question

我正在处理包含多个列表的网页：

<ul class="policies" id="p-1">
  <li><a href="p_1_1">Foo</a></li>
  <li><a href="p_1_2">Foo2</a></li>
</ul>
<ul class="policies" id="p-2">
  <li><a href="p_2_1">Foo</a></li>
  <li><a href="p_2_2">Foo2</a></li>
</ul>

这些href中的每一个都有一个匹配名称的数组：

var p_1_1 = ['ab', 'az', 'tx', 'wz'];
var p_1_2 = ['av', 'bq', 'cf', 'ts'];

每当用户点击其中一个列表项时，我就会使用JavaScript / jQuery将动态数量的图像附加到空div。图像的来源将从数组项中获取：

$('li a').on('click', function(e) {
  e.preventDefault();
  var useArray = $(this).attr('href').toString();
} );

for ( var i=0; i < array.length; i++ ) {
  $('div').append('<img src="'+ array[i] +'" />');
}

我的问题是，如何将href属性与正确的数组名称匹配才能输出正确的项目集？例如，当用户点击<a href="p_1_1">时，我需要输出数组p_1_1中的项目。我在JavaScript中使用数组的经验非常有限，并且对此主题有任何帮助。

Answer 1

不使用单独的数组，而是使用字符串作为键将它们全部包装在对象中：

var myStuff = {
    p_1_1 : ['ab', 'az', 'tx', 'wz'],
    p_1_2 : ['av', 'bq', 'cf', 'ts']
};

现在您可以使用以下方法轻松检索它们：

var foo = myStuff["p_1_1"];

或者在您的代码中：

var useArray = $(this).attr('href').toString();
var array = myStuff[useArray];

将元素的属性与JavaScript中的数组名称匹配

1 个答案: