Question

我有一个带有select标签的表单，有一些选项。当我点击按钮更改select标签中的值时，我想要这样，这样标签将具有我定义的值

document.getElementById('fruits').innerHTML="computer"

在这个JSFiddle中，单击按钮时它不起作用。

Answer 1

我看到jquery你可以尝试：

HTML：

<select id="sel">
    <option>Apple</option>
    <option>Orange</option>
</select>
<input type="button" value="change" onclick="fill()">

JS：

function fill() {
    $('#sel').empty();
    $("#sel").append(new Option("Computer"));

}

DEMO

或者使用vanilla js，您可以尝试：

function fill(){
    document.getElementById('sel').innerHTML="<option>Computer</option>";
}

DEMO2

Answer 2

function fill(){
    document.getElementById('fruits').innerHTML="<option>Meat</option>";}

<select id="fruits">
    <option> Apple</option>
    <option> Orange</option>
</select>

如果我找到你，那就在代码中进行这些更改。

Answer 3

试试这个

$('#change').click(function() {
    document.getElementById('fruits').innerHTML="<option>Meat</option>";
});

将HTML修改为

<select id="fruits"> 
    <option> Apple</option>
    <option> Orange</option>
</select>

<input type="button" value="change" name="change" id="change">

Answer 4

 your html is wrong. use the code like:

 <select id="fruits">
        <option>Apple</option>
        <option>Orange</option>
  </select>

  <input type="button" value="change" onclick="fill();" />

 And change the fill function to:

  function fill() {
        document.getElementById('fruits').innerHTML = "<option>Meat</option>";
    }

单击按钮时，更改选择标记内的值

4 个答案: