通過它的文本值選擇從下拉選項元素

給出一個HTML表單元素，如：通過它的文本值選擇從下拉選項元素

<select id='mydropdown'> 
    <option value='foo'>Spam</option> 
    <option value='bar'>Eggs</option> 
</select>

我知道我可以選擇與

document.getElementById("mydropdown").value='foo'

但是第一個選項，說我有一個具有值「垃圾郵件」的變量;我可以通過文本而不是其值來選擇下拉項目嗎？

來源

2011-04-12 geoffspear

var desiredValue = "eggs" 
var el = document.getElementById("mydropdown"); 
for(var i=0; i<el.options.length; i++) { 
    if (el.options[i].text == desiredValue) { 
    el.selectedIndex = i; 
    break; 
    } 
}

來源

2011-04-12 16:34:44

只需用innerHTML – 2014-02-21 08:01:37

代替（var i = 0; i clarifier 2016-07-13 13:10:27

我會使用selectedIndex或循環選擇由文本的選項，下面的代碼無法正常工作。

document.getElementById("mydropdown").text = 'Eggs';

來源

2011-04-12 16:28:13 daniellmb

我不想當前所選值的文本;我想根據文本設置值。儘管通過el.options循環查找正確的'.text'屬性看起來很有希望。 – geoffspear 2011-04-12 16:31:48

是的，我認爲這是你最好的選擇 – daniellmb 2011-04-12 16:35:04

如果你想通過它的innerText，而不是由你能做到這一點的值來獲得一個選項：

function go(){ 
    var dropdown = document.getElementById('mydropdown'); 
    var textSelected = 'Spam'; 

    for(var i=0, max=dropdown.children.length; i<max; i++) { 
     if(textSelected == dropdown.children[i].innerHTML){ 
      alert(textSelected); 
      return; 
     } 
    } 
}

來源

2011-04-12 16:30:56 Vismari

您使用的兒童收集與dropdown.options和dropdown.options [I]的.text任何理由？ – daniellmb 2011-04-12 16:32:57

沒有具體的原因，我只是寫了。 – Vismari 2011-04-12 16:47:32

較早的IE不處理一個選擇的選項子節點，但所有的瀏覽器實現一個選擇的選項集合的文本財產。

function selectbytext(sel, txt){ 
    if(typeof sel== 'string'){ 
     sel= document.getELementById(sel) || document.getELementsByName(sel)[0]; 
    } 
    var opts= sel.options; 
    for(var i= 0, L= opts.length; i<L; i++){ 
     if(opts[i].text== txt){ 
      sel.selectedIndex= i; 
      break; 
     } 
    } 
    return i; 
}

來源

2011-04-12 16:45:29 kennebec

通過它的文本值選擇從下拉選項元素

回答

相關問題