Question

获取数据属性的值后，如何找到现有的声明数组或变量？

例如

var myArray = [{a: 50, b: 70}, {a: 80, b: 90}],
    mySecondArray = [{a: 30, b: 20}, {a: 80, b: 40}];

$('.button').click(function() {
    var newArray = $(this).data('value'); // this will be a string depending on the value of any .button i clicked on <div data-value='myArray'></div>

    doSomething(newArray);
};

如何使用HTML 5属性查找现有数组并对其执行某些操作？

Answer 1

我建议使用两个数组作为属性创建一个对象。这样可以轻松查找所需的数组。

 var arrays = {
     myArray:[{a: 50, b: 70}, {a: 80, b: 90}],
     mySecondArray:[{a: 30, b: 20}, {a: 80, b: 40}]
 }

 $('.button').click(function() {
     var newArray = $(this).data('value'); 

     doSomething(arrays[newArray]);
  };

Answer 2

你不能（没有弃用的黑客）。

但是，您可以将可访问的数据存储在地图中

var data = {myArray: [...], mySecondArray: [...]};

并通过

查看值

doSomething(data[$(this).data('value')]);

示例：

var myArray = [{a: 50, b: 70}, {a: 80, b: 90}], mySecondArray = [{a: 30, b: 20}, {a: 80, b: 40}]; var data = {myArray, mySecondArray}; $('.button').click(function() { var newArray = $(this).data('value'); //console.log(window[newArray]); // hack - don't do it //console.log(eval(newArray)); // hack - don't do it console.log(data[newArray]); // good });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <button class="button" data-value="myArray">Click</button>

为什么不window[newArray]？因为它只允许查找在全局范围内通过var声明的变量。

为什么不eval(newArray)？见Why is using the JavaScript eval function a bad idea?

获取HTML5数据属性后查找数组/变量

2 个答案: