Jump to content

Help adding 2nd Dropdown


Recommended Posts

Hi,

I was able to implement this clickable dropdown once into my page: https://www.w3schools.com/howto/howto_js_dropdown.asp

However, when trying to add it to a second page it doesn't seem to work.

For background my page is 1 html file that is divided into article sections. In 1 section I was able to put this in and have it work for that articles page. However, when doing it for another article section although the button shows up, its clickable functions don't work. I click but nothing happens. I copied and pasted the code from the other article section there and changed the options to reference the things on the page i wanted them to jump to, so it is still calling the proper script and using the same css styling, but it doesn't drop down and show me the options.

Also if I comment out the other article section's dropdown, then the 2nd page works, but otherwise it does not.

Could someone please point out what I am missing and why it works on the one page still but not the other.

 

Link to post
Share on other sites

If you are coping that code same for other dropdown then use the different id for both dropdown.

You don't need to add different css but in javascript you should add other code also or try using target element.

Implement here

document.getElementById("myDropdown").classList.toggle("show");

Hope it'll help you.

Thanks!

Link to post
Share on other sites

Add 'this' as argument in Myfunction, this will now represent the element that triggered the event, in function add 'elem' parameter to represent the passed argument, then use nextElementSibling to move to next element (sibling). This is now not to a specific id reference which must be unique, but to triggering event element next sibling element.

https://www.w3schools.com/code/tryit.asp?filename=GH331JJASJPU

Edited by dsonesuk
Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...