Javascript Select Value Load

我用下拉菜單製作了一張桌子。Javascript Select Value Load

<tr> 
    <td>items</td> 
    <td><select id="afewitems"> 
     <option value="0">Select</option> 
     <option value="1">item1</option> 
     <option value="2">item2</option> 
    </td></select> 
</tr>

使用javascript（而不是jQuery）我想根據選擇動態加載屏幕上的項目。例如：當我選擇item1（value =「1」）時，我想根據選擇在網頁上加載額外的信息。（文字和/或圖像）

，我發現這個網站上： Adding additional data to select options using jQuery http://jsfiddle.net/GsdCj/2/

所以我的問題是：在Java的基礎上選擇ID /值我怎樣才能裝入預先寫好的信息？

來源

2013-11-03 user2950105

利用onchange HTML <select>屬性。

<select id="afewitems" onchange="changeInfo(this)"> 
<!-- (option tags) --> 
<div id="info"></div>

的JavaScript：

function changeInfo(el) { 
    var info = [ 
     "some text",  // option 0 
     "something else", // option 1 
     "..."    // option 2 
    ]; 
    var val = el.options[el.selectedIndex].value; 
    document.getElementById('info').innerHTML = info[val]; 
}

jsFiddle

下面是多<select>標籤的修改。

jsFiddle

來源

2013-11-03 16:09:31 azz

嘿明鏡Flatulator，謝謝你的快速反應。我到目前爲止所瞭解的是：您使用2個變量Info和Val創建了一個函數。 info變量包含基於值的自定義文本？ val變量im不太確定它做了什麼，但我認爲它獲取了您選擇的索引並將其打印爲.innerHTML？如果你能解釋你的代碼中發生了什麼，我會離我想要的更近一步：D。在這裏，你看到我有更多的選項標籤 http://jsfiddle.net/dUpnu/ 非常感謝你的幫助。 – user2950105

@ user2950105（對於遲到的迴應抱歉）當然，你的正確性在於'info'是每個選項標籤的文本（或HTML）數組。 'val'只是當前所選選項標籤的'value'屬性，所以使用您的選項標籤：''，'val'將等於'1'。該值用於索引到數組中。 – azz

Javascript Select Value Load

回答

相關問題