Question

I have a menu. Given a given value, I would like to return the text. For instance, 0 would return “zero”, 1 would return “one”, etc. Note that I do not care which option is currently selected nor do I want to auto-select the menu, but just want to use the select menu as a primitive database. Can this be done easily with JavaScript or jQuery without iterating over each option?

<select>
<option value="0">zero</option>
<option value="1">one</option>
<option value="2">two</option>
<option value="3">three</option>
</select>

Thanks

Answer 1

Instead of using the select as a database (requiring an expensive operation for simple lookups), create a data set from it once, then use that…

var vals = $('select option').map(function(i, el) { return el.text; })
                             .toArray();
alert(vals[2]); // "two"

---

Or if the option values aren’t sequential 0 based indices, then use an object…

var vals = {};

$('select option').each(function(i, el) { vals[el.value] = el.text });

alert(vals[2]); // "two"