Select `li` element in `listbox` (JavaScript)

Question

I want to present https://translate.yandex.com/m/translate page to user with preselected source and destination language. I can access to interesting element like this

var srcLangContent = document.getElementById("srcLanguagesContent")
var liToSelect = srcLangContent.children[10]

What to do next I don't know. I called click(), but it's not working. Can you give some advice?

P.S. I can't use jQuery

It looks like a third party library which is creating that full page select (rather than a traditional html select). It's likely you'll need to use an api (if the library has one) in order to use it to pre-select a defined value. — Phil Cooper, Oct 18 '15 at 08:42
Yes, you can simulate user action - see this post [How to trigger event in JavaScript?](http://stackoverflow.com/questions/2490825/how-to-trigger-event-in-javascript) on how to do that. Problem is, you'll only be showing the select menu, rather an pre-selecting a value. Also, if the click() isn't working (as you stated) you need to find the element in the library that triggers the opening of the select menu. Try performing the click on parent and children to see which one might be causing the select to show. — Phil Cooper, Oct 19 '15 at 08:50

score 0 · Accepted Answer · answered Nov 07 '15 at 15:05

Here is solution.

var mouse_down_evt = document.createEvent("MouseEvents");
mouse_down_evt.initMouseEvent("mousedown", true, true, window, 0, 0, 0, 80, 20, false, false, false, false, 0, null);

var mouse_up_evt = document.createEvent("MouseEvents");
mouse_up_evt.initMouseEvent("mouseup", true, true, window, 0, 0, 0, 80, 20, false, false, false, false, 0, null);

liToSelect.dispatchEvent(mouse_down_evt)
liToSelect.dispatchEvent(mouse_up_evt)

Thank you @PhilCooper for advice.

Select `li` element in `listbox` (JavaScript)

1 Answers1