Javascript array trouble

Question

Its been a long day and I've learnt much about js but my heads fuzzled on this one, ok so I need to get one of the array numbers (depending on the one the user clicks into the settings below. but i have no idea how, ive tried reading up on arrays but i cant get my head around it. :/

Sorry, I need to call a function every time I click on a different link and i need the functions to repond to each div seperatly.

var navLink = new Array();

    navLink[0] ='#one' < this is the Id of an href link.
    navLink[1] ='#two'
    navLink[2] ='#three'
    navLink[3] ='#four'
    navLink[4] ='#five'
    navLink[5] ='#six'  

var navDiv = new Array();

    navDiv[0] ='#content-one' < this is the Id of a content div.
    navDiv[1] ='#content-two'
    navDiv[2] ='#content-three'
    navDiv[3] ='#content-four'
    navDiv[4] ='#content-five'
    navDiv[5] ='#content-six'   

var settings = {

    objSlideTrigger: navLink[x], // link button id
    objSlidePanel: navDiv[x] // slide div class or id
}

I hope i have explained myself well enough... sorry if i havent.

I know this works but it only works for one...

var settings = {

    objSlideTrigger: '#one', // link button id
    objSlidePanel: '#content-one' // slide div class or id
}

Heres a js fiddle that shows the core element of what im trying to achieve. Howeve this is just a single link and content box, i want multiple links and content boxes. that all respond individually to being selected. jsfiddle.net/BeU3U/6/

Dow you want to get the index of the element on which the user clicked? — me_digvijay
– me_digvijay, Commented Oct 9, 2013 at 5:15
Im not sure i just want the element clicked to be call the function. — Lewis
– Lewis, Commented Oct 9, 2013 at 5:29
Please could you show, and explain, what you want to happen when you click an element? What function should be called? What output do you expect? — David Thomas
– David Thomas, Commented Oct 9, 2013 at 5:30
@DavidThomas heres a js fiddle showing what happens when one element is clicked but i need six individual elements... jsfiddle.net/BeU3U/6 — Lewis
– Lewis, Commented Oct 9, 2013 at 5:32

maček · Accepted Answer · 2013-10-09 05:17:07Z

2

I think this could work for you. Just make sure that navLinks is always the same length as navDivs.

var navLinks = [
  '#one',
  '#two',
  '#three',
  '#four',
  '#five',
  '#six',
];

var navDivs = [
  '#content-one',
  '#content-two',
  '#content-three',
  '#content-four',
  '#content-five',
  '#content-six',
];

var settings = [];

for (var i=0; i<navLinks.length; i++) {
  settings.push({
    objSlideTrigger: navLinks[i],
    objSlidePanel: navDivs[i],
  });
};

console.log(settings);

Output

[
  {objSlideTrigger: "#one", objSlidePanel: "#content-one"},
  {objSlideTrigger: "#two", objSlidePanel: "#content-two"},
  {objSlideTrigger: "#three", objSlidePanel: "#content-three"},
  {objSlideTrigger: "#four", objSlidePanel: "#content-four"},
  {objSlideTrigger: "#five", objSlidePanel: "#content-five"},
  {objSlideTrigger: "#six", objSlidePanel: "#content-six"},
]

answered Oct 9, 2013 at 5:17

maček

78k37 gold badges172 silver badges200 bronze badges

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

3 Comments

Lewis Over a year ago

This does not work Im getting no response on the web page... :/

Lewis Over a year ago

Would it help if i post the functions it is calling too ?

maček Over a year ago

@Beaniie, yeah, I don't know what you mean by it doesn't work. The code I provided generates the output below. You can use settings to bind onclick listeners or something like that.

jbarnett · Accepted Answer · 2013-10-09 05:39:34Z

1

You can probably achieve this with an array of JSON elements.

var nav = [
    {"navLink": "#one", "navDiv": "#content-one"},
    {"navLink": "#two", "navDiv": "#content-two"},
    {"navLink": "#three", "navDiv": "#content-three"},
    {"navLink": "#four", "navDiv": "#content-four"},
    {"navLink": "#five", "navDiv": "#content-five"},
    {"navLink": "#six", "navDiv": "#content-six"}
];

var settings = function (rowIndex) {
    objSlideTrigger: nav[rowIndex]["navLink"],
    objSlidePanel: nav[rowIndex]["navDiv"]
};

answered Oct 9, 2013 at 5:39

jbarnett

9845 silver badges7 bronze badges

1 Comment

Lewis Over a year ago

Sorry, this one isnt working for me either, its not repsonding how it would with just the single elements. See Question (Updated).

Blu · Accepted Answer · 2013-10-09 05:25:56Z

0

try this one below

var settings = function (rowIndex)
{
    objSlideTrigger:navLink[rowIndex], 
    objSlidePanel:navDiv[rowIndex] 
}

edited Oct 9, 2013 at 5:25

Blu

4,0646 gold badges41 silver badges65 bronze badges

answered Oct 9, 2013 at 5:19

Ravindran_Quan

294 bronze badges

4 Comments

Lewis Over a year ago

var settings = function (rowIndex){ objSlideTrigger: navLink[rowIndex], objSlidePanel: navDiv[rowIndex] < its saying there is a syntax error here }

Blu Over a year ago

put semicolon ; instead of comma , at the end of :newLink[rowIndex]

Lewis Over a year ago

Thanks, that fixed the syntax error but im still getting no respnse from the web page, mabye it will make more sense if i showed you was im trying to achive (jsfiddle.net/BeU3U/6/)

Ravindran_Quan Over a year ago

could u try var settings = function (rowIndex) { objSlideTrigger=navLink[rowIndex]; objSlidePanel=navDiv[rowIndex] ; }

Collectives™ on Stack Overflow

Javascript array trouble

3 Answers 3

3 Comments

1 Comment

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

1 Comment

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related