javascript - 使用选项索引将选项代码替换为另一个代码

Question

我有一个下拉列表

<select name="answers[0][]">                            
   <option value="0" >Beredskap</option>                            
   <option value="1" >Förbundsledning</option>                          
   <option value="2" >Förbundsledning stab</option>
   <option value="3" >Ekonomiavdelningen</option>
</select>

我正在寻找的是获得价值getElementsByTagName('select')[1]，然后将其替换为

<option value="1" disabled >Förbundsledning</option>

原因是列表是自动生成的，所以我需要修改 html 输出。

我到目前为止不起作用的是：

document.getElementsByTagName('select')[0]
        .innerHTML.replace('<option value="1" disabled>apple</option>')

Answer 1

值为 1 的选项恰好位于代码中的索引 1 处，如果始终如此，则除此之外的其他答案将适用。

如果您不知道生成选项的顺序，因此不知道要更改的选项的索引，则取决于您是要根据值更改文本还是原始文本。

你可以这样做：

var options = document.getElementsByTagName("option");
for(var e = 0; e < options.length; e++) {
    //change by text
    if (options[e].text == "Apple") {
        options[e].text = "Förbundsledning";
    }

    //change by value
    if (options[e].value == "1") {
        options[e].text = "Förbundsledning";    
    }
}

Answer 2

document.getElementsByTagName('select')[0].options[1].text="apple"

[1]是您的选项项目的索引。0 = Beredskap，1 = Förbundsledning。

Answer 3

你可以使用 jQuery 和选择器来找到你的列表框 $('#myListBox').val();

您可以通过 $('#myListBox').val("new value"); 轻松更改值

您还可以轻松地遍历选项列表并做任何您想做的事情。

$("#id option").each(function()
{
    // add $(this).val() to your list
});

Answer 4

这个怎么样 ？

var sel = document.getElementsByTagName('select')[0];
sel.innerHTML = sel.innerHTML.replace('Förbundsledning', 'apple');

http://jsfiddle.net/VxhvF/

Answer 5

使用功能；

function select_text_replace(option_text, replace_text) {
    var el = document.getElementsByTagName('select')[0];
    el.innerHTML = el.innerHTML.replace(option_text, replace_text);
};


select_text_replace("Förbundsledning", "apple");
select_text_replace("Ekonomiavdelningen", "apple2");

见示例：http: //jsfiddle.net/sm94N/