0

我的页面上有三个 html 按钮:

<button class="timespanbutton" value="1">1</button>
<button class="timespanbutton" value="2">2</button>
<button class="timespanbutton" value="3">3</button>

现在我想创建一个数组,其中包含每个按钮的对象:

var timespanObject = {}, timespanArray = [];
countSpecificFacilitySlotAmount = 3;

$('.timespanbutton').each(function() {
 slotName = "timespanbutton" + $(this).val();
  timespanObject.timespanName = slotName;
    timespanArray.push(timespanObject);
});

获取一个包含 3 个对象的数组,每个对象的名称都像

timespanbutton1
timespanbutton2
timespanbutton3

我真的不知道,我做错了什么,但三个都得到了名字

timespanbutton3

我究竟做错了什么?

4

2 回答 2

1

好吧,您正在更改同一对象的引用

通过示例了解它是如何工作的

let a ={};
let b = a;
a.name = 'xyz';
a.name = 'abc';
console.log(a.name)
console.log(b.name)

所以在上面的例子中,我们有两个变量 a 和 b。a 是一个对象。

  1. 每次我们更新名称时,最后一个值都会被新的值覆盖。
  2. 当我们将对象分配给任何其他变量时,它被分配为引用而不是副本。因此,当我们更改 a 的值时,如果您打印 b,您可以看到更改。

您的代码的工作版本如下

var timespanArray = [];
countSpecificFacilitySlotAmount = 3;

$('.timespanbutton').each(function() {
 slotName = "timespanbutton" + $(this).val();
 var timespanObject = {};
  timespanObject.timespanName = slotName;
    timespanArray.push(timespanObject);
});

console.log(timespanArray)
<script
			  src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
			  integrity="sha256-3edrmyuQ0w65f8gfBsqowzjJe2iM6n0nKciPUp8y+7E="
			  crossorigin="anonymous"></script>
<button class="timespanbutton" value="1">1</button>
<button class="timespanbutton" value="2">2</button>
<button class="timespanbutton" value="3">3</button>

于 2018-12-09T16:56:42.153 回答
0

您需要在循环中声明 slotname 变量,它在上下文中引用并始终具有最后一个值。

所以试试这个

$('.timespanbutton').each(function() {
    var slotName = "timespanbutton" + $(this).val(); // new var declare
    var timespanObject.timespanName = slotName;
    timespanArray.push(timespanObject);
});
于 2018-12-09T16:55:07.303 回答