web-dev-qa-db-ja.com

JQueryではなくJavascriptを使用して選択したオプションIDを取得する方法

両方の選択タグに対して、選択したオプションIDをJQueryではなくJavascriptで印刷する必要があります。

複数の選択タグがあると仮定します。

<select  onchange="showOptions(this)" id="my_select1">
   <option value="a1" id="ida1">Option1</option>
   <option value="a2" id="ida2">Option2</option>
</select>

<select  onchange="showOptions(this)" id="my_select2">
   <option value="b1" id="idb1">Option1</option>
   <option value="b2" id="idb2">Option2</option>
</select>

私は次の方法を見つけましたoptions[selectedIndex].idしかし、どの行がその行を参照しているかをどのようにして知ることができますか。

助言がありますか？

以下を試しましたがうまくいきませんでした。

<select id="my_select" onchange="showOptions2(this)">
   <option value="o1" id="id1">Option1</option>
   <option value="o2" id="id2">Option2</option>
</select>


<script type = "text/javascript">


function showOptions2(s){
 var adVALUE = console.log(s[s.selectedIndex].value); // get value
 var adID = console.log(s[s.selectedIndex].id); // get id

  alert(adID);

}
</script>
javascripthtmlselect
12
yorgos
<select onchange="showOptions(this)">
   ...

この関数は仕事をします

function showOptions(s) {
  console.log(s[s.selectedIndex].value); // get value
  console.log(s[s.selectedIndex].id); // get id
}

他の目的で使用しない限り、id要素のselectを省略できることに注意してください。

Jsbinの例： http://jsbin.com/adopiz/2/edit

27
fcalderan