Javascript-Funktion nicht richtig aufgerufen

Question

Ich versuche, auf den ersten Radio-Button klicken und es wird Variablen distSelected und Waffe einige Werte aus dem Objekt engDistanceObject zuweisen. Ich vermute, dass mein HTML möglicherweise nicht korrekt geschrieben wird ... insbesondere die Eingabe-Tags.

https://jsfiddle.net/Natronox/sbojaxm4/#&togetherjs=zb80KxkQzm

var engDistanceObject = { 
short: ["100m-300m","416 Assault Rifle"], 
long: ["300m-1000m","M110 DMR"] 
}; 

var distSelected; 
var weapon; 

function distanceClick(item){ 
distSelected = engDistanceObject.item[0]; 
weapon = engDistanceObject.item[1]; 
console.log(distSelected,weapon); 
}; 

Answer 1

Verwenden Sie Ihre kurze und lange Eigenschaften statt Punkt. Sie haben keinen Objekteigenschaftsnamen in Ihrem Objekt.

.Kurze [0]

.Kurze [1]

Answer 2

dynamischen Eigenschaften zuzugreifen, können Sie nicht die . Syntax. Es ignoriert Variablen, die möglicherweise denselben Namen wie die Eigenschaft haben, auf die Sie zugreifen möchten, und versucht stattdessen, auf die nicht vorhandene item-Eigenschaft zuzugreifen.

Verwenden Sie stattdessen die Klammer-Syntax [], mit der eine Zeichenfolge für den Zugriff auf dynamische Eigenschaften verwendet werden kann. Dies bedeutet, dass Sie eine Zeichenfolge als Parameter an Ihre Funktion übergeben müssen.

Ihre HTML-Event-Handler müssen Anführungszeichen um die Parameter:

onclick="distanceClick('long')" 

Und dann die Klammer-Syntax in Ihrem JS verwenden:

function distanceClick(item){ 
    distSelected = engDistanceObject[item][0]; 
    weapon = engDistanceObject[item][1]; 
    console.log(distSelected, weapon); 
}