用数组参数单击Javascript

Question

我试图找出如何使以下代码工作：

<ul> 
    <li id='anvil1' class='locked' onclick='anvil1.countCheck("anvil1", "defense", 10, event.button);'>+10 Defensive Ability</li>
    <li id='anvil4' class='locked' onclick='anvil4.countCheck("anvil4", "[\"defense\", \"constitution\"]", [10, 20], event.button);'>+15 Defensive Ability <br />+20 Constitution</li> 
</ul>

这些链接正在从星型对象访问方法。我需要第二个和第三个参数是数组，因为它们有一个可变的值。例如，第一颗星anvil1有一个stat (防御)和一个值(10)。第四颗星有两个属性(防御，体质)和两个值(10，20)。我相信统计数据/值的数量可以增加到3。

到目前为止，如果我试图调用stats[0]，返回的值只是第一个字母？

alert('Stats: ' + stats[0]);将生成带有Stats: d或Stats: [的警报框。

我不知道如何解决这个问题，任何建议都将不胜感激！

Answer 1

你能分辨出不同之处吗？

"[\"defense\", \"constitution\"]"

是一个字符串

[10, 20]

是一个数组。显然，您也希望将第二个参数作为数组，因此需要将调用更改为

anvil4.countCheck("anvil4", ["defense", "constitution"], [10, 20], event.button);

Answer 2

你的数组有引号。当在字符串上使用n时，它返回n‘’th字符。您还可以去掉字符串转义符(如elclanrs所说)。

Answer 3

我不会那样传递参数的。您可以为anvil元素添加一个事件侦听器，并传递带有数据属性的参数。

请查看下面的片段或此小提琴中的代码段。

​

var anvil = {
	countCheck: function(e) {
  	var props = this.dataset.props.split(','),
    		points = this.dataset.points.split(',');
    
    console.log(this.id, props, points);
  }
}


// add eventlisteners
var anvils = document.getElementsByClassName('anvil');

for (var i=0; i< anvils.length; i++) {
	anvils[i].addEventListener('click', anvil.countCheck);
}

<ul> 
    <li id='anvil1' class='anvil locked' data-props="defense" data-points="10">+10 Defensive Ability</li>
    <li id='anvil4' class='anvil locked' data-props="defense,constitution" data-points="10,20">+15 Defensive Ability <br />+20 Constitution</li> 
</ul>

​