如何使用显示文本设置select元素的selectedIndex？

问题描述

如何使用显示文本作为参考设置select元素的selectedIndex？

How to set selectedIndex of select element using display text as reference?

示例：

<input id="AnimalToFind" type="text" />
<select id="Animals">
    <option value="0">Chicken</option>
    <option value="1">Crocodile</option>
    <option value="2">Monkey</option>
</select>
<input type="button" onclick="SelectAnimal()" />

<script type="text/javascript">
    function SelectAnimal()
    {
        //Set selected option of Animals based on AnimalToFind value...
    }
 </script>

有没有其他方法可以在没有循环的情况下执行此操作？你知道，我在想一个内置的JavaScript代码。另外，我不使用jQuery ...

Is there any other way to do this without a loop? You know, I'm thinking of a built-in JavaScript code or something. Also, I don't use jQuery...

推荐答案

试试这个：

function SelectAnimal() {
    var sel = document.getElementById('Animals');
    var val = document.getElementById('AnimalToFind').value;
    for(var i = 0, j = sel.options.length; i < j; ++i) {
        if(sel.options[i].innerHTML === val) {
           sel.selectedIndex = i;
           break;
        }
    }
}

这篇关于如何使用显示文本设置select元素的selectedIndex？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！