使用html下拉列表按值獲取正確的顯示文本

Question

我有一些創建下拉列表的html。 該列表具有文本值和顯示給用戶的文本。 我根據用戶選擇的“值”保存一些XML。 在其他時間點，我需要解析XML並顯示原始文本，但不在原始列表中。 此時，我僅具有列表中的“值”，而沒有其顯示文本。 最初，我打算使用switch語句來獲取顯示文本，但是后來有了使用列表中包含的信息的想法。 是否可以使用一些javascript來使用我必須在列表中查找顯示版本的值？ 如果是這樣，有人可以提供代碼段嗎？ 我嘗試了不同的方法，但到目前為止還是空白。 下面顯示的是構成列表的html示例。

'<select id="ifmgr_tr_Field">' +
'<option value="DeviceId">Device ID</option>' +
'<option value="DeviceMac">Device MAC</option>' +
'<option value="DeviceType">Device Type</option' +
'</select>';

假設我有一個“ DeviceMac”值，我要從該列表中獲得的是“ Device MAC”。 請記住，我現在不想使用列表顯示值。

編輯

我可以這樣做，但是感覺有點臟。

var item = $('#ifmgr_tr_Field')[0] ;
item.value = field; // field would be the value I have, EG “DeviceMac”
var text = item.options[item.selectedIndex].text; // This will give me “Device MAC” which is what I want.

Answer 1

我希望這會有所幫助。 好吧，它仍然有一個if條件。 但是正如您所說的，ListBox中的值不會更改。 它使用列表作為查找，並找到選項，其中“選項的文本”是“設備MAC”。 嗯...好吧，我使用了jQuery，因為它比傳統的javascript具有更好的loop（each）函數。

    $('#ifmgr_tr_Field option').each(function () {
        var option = this;
        if(option.text == 'Device MAC')
        alert(option.text + " Value : " + option.value);
    }); 

Answer 2

我不確定您到底想在JS函數中做什么，但是您需要將onchange屬性添加到您的選擇項中。 它需要指向您的JS函數，並在更改時傳遞值。

'<select onchange="doTheFunction(this.value);" id="ifmgr_tr_Field">' + ...

然后在您的JS代碼中：

function doTheFunction(val){

   //val will hold the newly selcted value

   if (val=="DeviceId"){
      //do something for DeviceId

   } else if (val=="DeviceMac"){
      //do something for DeviceMac

   } else if (val=="DeviceType"){
      //do something for DeviceType

   }
}