htmlのselect要素から選択したオプションをjsで使用するには？

Question

私はコードを書いています。ユーザーにオプションを選択させてから、どのオプションを選択したかを文書化する必要がある場合、どのようにすればよいですか？たとえば、オプション7を選択した場合、その文書にその値を書き込む方法を教えてください。あなたのお時間をありがとうございました！

<p> What is your destination? 
 
    <select> 
 
     <option value="mercury">Mercury</option> 
 
     <option value="venus">Venus</option> 
 
     <option value="mars">Mars</option> 
 
     <option value="jupiter">Jupiter</option> 
 
     <option value="saturn">Saturn</option> 
 
     <option value="uranus">Uranus</option> 
 
     <option value="neptune">Neptune</option> 
 
     <option value="pluto">Pluto</option> 
 
    </select> 
 
    <script type="text/javascript"> 
 
     var planets = new Array(Mercury, Venus, Mars, Jupiter, Saturn, Uranus, Neptune, Pluto); 
 
     planets[0] = 48000000 
 
     planets[1] = 25000000 
 
     planets[2] = 33900000 
 
     planets[3] = 365000000 
 
     planets[4] = 1200000000 
 
     planets[5] = 2600000000 
 
     planets[6] = 2800000000 
 
     planets[7] = 4600000000 
 
    </script> 
 
</p>

Answer 1

ファーズは、select要素にすることによってそれを見つけるためにIDを与えます。そして、あなたはこのような何かを試みることができる：

var elm = document.getElementById('selectBox'); 
var selectedOption = elm.options[elm.selectedIndex].value; 

selectedOptionは現在

Answer 2

は、この情報がお役に立てば幸い選択された値が含まれます。私はイベントリスナーonchangeをselect要素に追加しました。

var planets = new Array(); 
 
planets['mercury'] = 48000000; 
 
planets['venus']=25000000 
 
planets['mars']=25000000 
 
planets['jupiter']=33900000 
 
planets['saturn']=365000000 
 
planets['uranus']=1200000000 
 
planets['neptune']=2600000000 
 
planets['pluto']=2800000000 
 

 
function selectDestination(selectedValue) { 
 
    window.alert(selectedValue + " distance=" + planets[selectedValue]); 
 
}  

What is your destination? 
 
     <select onchange="selectDestination(this.value)"> 
 
     <option value="mercury">Mercury</option> 
 
     <option value="venus">Venus</option> 
 
     <option value="mars">Mars</option> 
 
     <option value="jupiter">Jupiter</option> 
 
     <option value="saturn">Saturn</option> 
 
     <option value="uranus">Uranus</option> 
 
     <option value="neptune">Neptune</option> 
 
     <option value="pluto">Pluto</option> 
 
     </select> 
 
    

Answer 3

まず、すでにあなたがseleted何（選択オプションをクリックする！右？）のドキュメントに保存されています。

したがって、いくつかのオプションを選択したデータを別のドキュメントに保存する必要はありません。

これで、ユーザーが選択したオプションを取得しましょう！

$("select option:selected").text(); 

ユーザーが何らかのオプションを選択すると、その選択要素に「selected」javascriptプロパティが追加されます。そして、jQueryは "selected"プロパティが追加された要素を検索することができます。その要素のテキストを取得します。

Easy！

あなたはjQueryのを使用しない場合は、純粋なjavascriptのは、同じ作業を行うことができます

var e = document.getElementById("#idOfSelectElement"); 
var selectedData = e.options[e.selectedIndex].value;