Question

I have a button like so:

<button id='abc' value=['fred', 26]></button>

I want to know how I can access those two values via JQuery’s .val() function.

I have tried $("#abc").val()[0] but that just appears to give me the first character which is the bracket “[“.

I would like .val()[0] to instead give me the value “Fred”.

Answer 1

Your HTML is invalid. You should try;

<button id='abc' value="['fred', 26]"></button>

However, you should look at using valid JSON notation, to enable you to parse the data as an array. JSON requires double quotes for strings (rather than single '), so you should end up with;

<button id='abc' value='["fred", 26]'></button>

If you were to access $('#abc').val() directly now, you’d retrieve the string ["fred", 26]. To retrieve this data as an array, you should parse the data using jQuery.parseJSON();

var array = jQuery.parseJSON($('#abs').val());
for (var i=0;i<array.length;i++) {
    alert(array[i]);
};