Javascript onclick with array parameters

Question

I'm trying to figure out how to make the following code work:

<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>

These links are accessing methods from the the star object. I need the 2nd and 3rd parameters to be arrays, because they have a variable number of values. For instance, the first star, anvil1, has one stat (defense) and one value (10). The fourth star has two stats (defense, constitution) and two values (10, 20). I believe the number of stats/values can go up to 3.

So far, if I try to call stats[0] the value that's returned is simply the first letter?

alert('Stats: ' + stats[0]); results in an alert box with Stats: d or Stats: [

I'm not sure how to fix this, and any advice would be greatly appreciated!

Why are you escaping " when in between 's. In any case, I would recommend adding the events in JavaScript. Check addEventListener — elclanrs
– elclanrs, Commented Mar 19, 2016 at 22:14
You are not passing an array with "[\"defense\", \"constitution\"]" but a string. Why not do it like you did for the 3rd parameter ? [\"defense\", \"constitution\"] <- this is an array. And this is why stats[0] is [ (first character in the string). — PinkTurtle
– PinkTurtle, Commented Mar 19, 2016 at 22:43
I just tried everything I could think of to get it to work - " " like in the first example, [ ] (not shown), [\" "], might have been a few others. You're suggesting I remove the 'onclick' section and instead use an event listener to call the functions? — Kendra
– Kendra, Commented Mar 19, 2016 at 22:45
@PinkTurtle [\"defense\", \"constitution\"] gives a syntax error. — Kendra
– Kendra, Commented Mar 19, 2016 at 22:49
See my answer I made a typo indeed. It should have been ["defense", "constitution"] — PinkTurtle
– PinkTurtle, Commented Mar 19, 2016 at 22:49

PinkTurtle · Accepted Answer · 2016-03-19 22:47:09Z

1

Can you spot the difference ?

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

is a string and

[10, 20]

is an array. Obviously you want your 2nd parameter as an array too so you need to change your call to

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

answered Mar 19, 2016 at 22:47

PinkTurtle

7,0513 gold badges31 silver badges51 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Mason Jones · Accepted Answer · 2016-03-19 22:45:04Z

0

you have your array in quotes. when you use [n] on a string it returns the n'th character. you can also get rid of the string escapes (like elclanrs said)

answered Mar 19, 2016 at 22:45

Mason Jones

1612 silver badges7 bronze badges

Comments

AWolf · Accepted Answer · 2016-03-19 22:55:51Z

I wouldn't pass the parameters like that. You could add one eventlistener for anvil elements and pass the parameters with data attributes.

Please have a look at the following snippet or in this jsfiddle.

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>

Collectives™ on Stack Overflow

Javascript onclick with array parameters

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related