0

ドロップダウンの内容をコピーする小さなスクリプトがあります。しかし、ドロップに名を表示したいのですが、名を選択したときに、名を外部にコピーしたいと思います。他の属性を使用する必要がありますVALUE

JS：

function copy() {
    document.getElementById("label").innerHTML = 
        document.getElementById("mySelect").value
}

HTML：

<div id="label"></div>

<select id="mySelect" onchange="copy();">
<option value="">Select a person:</option>
    <option value="firstname" id="lastname">Firstname</option>
    <option value="firstname" id="lastname">Firstname</option>
    <option value="firstname" id="lastname">Firstname</option>
    <option value="firstname" id="lastname">Firstname</option>
</select>

またはここを参照してくださいhttp://jsfiddle.net/r6Fus/

4

2 に答える 2

3

に追加データidを提供するためだけに、要素の属性を誤用しないでください。別の回答<option>で示唆されているように、代わりに、スクリプトでそのような追加の属性を指定し、後でアクセスすることができます（次のコードはテストされていません）。data-lastname

HTMLは次のようになります。

<select id="mySelect" onchange="copy();">
<option value="">Select a person:</option>
    <option value="firstname" data-lastname="lastname">Firstname</option>
    <option value="firstname" data-lastname="lastname">Firstname</option>
    <option value="firstname" data-lastname="lastname">Firstname</option>
    <option value="firstname" data-lastname="lastname">Firstname</option>
</select>

JS関数は次のようになります。

function copy() {
  var sel = document.getElementById('mySelect');
  var selected = sel.options[sel.selectedIndex];
  var firstname = selected.value;
  var lastname = selected.getAttribute('data-lastname');
  // do stuff...
}
于 2013-01-28T14:29:29.427 に答える
2

data-surnameそれぞれに属性を追加します<option>：

<option value="tcs" data-surname="Washington" >tcs</option>

（IDを使用してこれを行うことができますが、この場合、データ属性の方が優れたソリューションのようです）

次に、関数を更新して、surname属性を取得します:( jQueryを使用することをお勧めします）

function copy( {
  $("#label").html($("#mySelect option:selected").data("surname"))
}

実例（メニューの最初のオプションを試してください）-jsFiddle

于 2013-01-28T14:28:52.773 に答える