JavaScript复制值optgroup到其他输入

时间:2016-07-24 15:06:24

标签: javascript select option optgroup

我选择了选项:

<form>
<select name="sel" id="sel" onchange="run()">
<option selected disabled>Wybierz...</option>
  <optgroup id="user" value="user" label="user">
    <option value="1">michal</option>
    <option value="2">mateusz</option>
  </optgroup>
  <optgroup id="warehouse" value="warehouse" label="warehouse">
    <option value="1">kosz</option>
    <option value="2">zaginione</option>
  </optgroup>
</select>
</form>


<input type="text" name="copy" id="copy"></input>

用于在输入文本中添加文本的脚本:

function run() {
    if(document.getElementById("user").label == 'user'){

      document.getElementById("copy").value = "user";

    } else if (document.getElementById("warehouse").label == 'warehouse') {

        document.getElementById("copy").value = "warehouse";

    }
}

当用户选择带有第一个optgroup(“用户”)的选项时,则在输入文本脚本中添加名称“user”。当用户从第二个optgroup选择记录时,脚本将输入文本中的文本更改为“仓库”。但是在我的脚本中,输入文本中没有添加任何内容。 demo

1 个答案:

答案 0 :(得分:1)

Demo

在jsfiddle中你已经将函数放在onload函数中,因此它对于外部作用域来说是未定义的。对于这两个组,你将得到user document.getElementById("user").label == 'user'总是正确的。所以它不会阻止。你应该获得所选组的标签值并进行比较。

var lable=event.target.options[event.target.selectedIndex].parentNode.label // get lable value of clicked group
if(lable == 'user'){

  document.getElementById("copy").value = "user";

} else if (lable == 'warehouse') {

    document.getElementById("copy").value = "warehouse";

}