how to open a select options on a external button click

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <button id="btn">Open Select</button> <select id="select"> <option>1</option> <option>2</option> <option>3</option> <option>4</option> </select> </body> </html>

javascript html5

17th Mar 2023, 12:05 PM

TINKLE DASH

4 Answers

+ 1

TINKLE DASH Maybe someone like this? (createEvent/initEvent/dispatchEvent) https://code.sololearn.com/WW52VCsyZKLN/?ref=app

17th Mar 2023, 1:12 PM

Bob_Li

Bob_Li thank you for your help but it's only working in my mobile not in my PC

17th Mar 2023, 2:07 PM

TINKLE DASH

The select element have very limited options for js manipulations and as you have already found out, behaves differently on different environment. Perhaps creating a custom dropdown component would be better. A lot more work, but better control. Or maybe some other members can help us out?

17th Mar 2023, 3:27 PM

Bob_Li

TINKLE DASH here is a custom dropdown without using the select DOM element and withhout using custom event https://code.sololearn.com/Ws3jManuAUvX/?ref=app

18th Mar 2023, 5:45 AM

Bob_Li