的Javascript的onclick與數組參數

我試圖找出如何使下面的代碼工作：的Javascript的onclick與數組參數

<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擁有一個屬性（防禦）和一個值（10）。第四顆恆星有兩個屬性（防禦，憲法）和兩個值（10,20）。我相信統計/數值的數量可以上升到3.

到目前爲止，如果我嘗試撥打stats[0]，返回的值只是第一個字母？

alert('Stats: ' + stats[0]);導致一個警告框，Stats: d或Stats: [

我不知道如何解決這個問題，任何建議將不勝感激！

來源

2016-03-19 Kendra

你爲什麼要當'''s的逃離'「'。在任何情況下，我會建議增加_in JavaScript_的事件。檢查'addEventListener' – elclanrs

你是不是一個合格['\「defense \」，\「constitution \」]「''但是一個字符串。爲什麼不像你爲第三個參數做的那樣？'[\」defense \「，\」constitution \「]'' '< - '這是一個數組，這就是爲什麼'stats [0]'是'['（字符串中的第一個字符）。 – PinkTurtle

我只是想盡一切辦法讓它工作 - 「」就像第一個例子，[]（未示出），[\「」\]，可能是其他幾個。您建議我刪除'onclick'部分，而是使用事件偵聽器來調用函數？ – Kendra

你可以發現差異？

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

是一個字符串，

[10, 20]

是一個數組。顯然你想你的第二個參數作爲一個陣列太所以你需要改變你的電話

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

來源

2016-03-19 22:47:09 PinkTurtle

你有你的數組引用。當你在一個字符串上使用[n]時，它返回第n個字符。你也可以擺脫字符串逃逸（像elclanrs說）

來源

2016-03-19 22:45:04

我不會傳遞這樣的參數。您可以爲anvil元素添加一個eventlistener並將參數傳遞給數據屬性。

請看下面的代碼片段或者在這個jsfiddle。

var anvil = { 
 
\t countCheck: function(e) { 
 
    \t var props = this.dataset.props.split(','), 
 
    \t \t 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++) { 
 
\t 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>

來源

2016-03-19 22:55:51 AWolf

回答

相關問題