首頁  >  文章  >  web前端  >  javascript取得下拉列錶框當中的文字值範例程式碼_javascript技巧

javascript取得下拉列錶框當中的文字值範例程式碼_javascript技巧

WBOY
WBOY原創
2016-05-16 17:27:421151瀏覽

近日碰到一個問題,就是需要將使用者點選下拉清單當中某個選項後,將其所選的內容儲存起來,例如下面的HTML程式碼:

複製代碼 代碼如下:



也就是說當使用者選擇「上海」這一列時,就需要將「上海」這個名稱儲存起來。其實方法很簡單。看下面javascript程式碼:
複製程式碼 程式碼如下:

function Selectised(value) { 🎜>var cityName;
var city = document.getElementById("city");
//取得選取的城市名稱
for(i=0;iif(city[i].selected==true){
cityName = city[i].innerText; //關鍵點
alert("cityName:" cityName);
}
}

也可以這麼做:

複製程式碼 代碼如下:function isSelected(value) {
var city = document.getElementById("city");
alert(city.options[city.selectedIndex].innerText);
}
}


大致解釋一下,首先在HTML頁面上有一個下拉框,並為此下拉框定了一個「city」的id,並為其綁定了一個onchange事件,透過此事件呼叫javascript函數。

在javascript函數當中,透過domcument物件取得目前下拉框的節點元素,由於節點的值並非只有一個,所以我們可以透過循環節點來得到每個選項的值。在循環的時候透過判斷目前選項是否選中,如果選取則使用city[i].innerText 方式取得目前所選的文字值。當然如果需要取得選項值,只需如此即可:city[i].value.

至此,透過以上方法在IE下已能達到所需的結果。但是,在FIREFOX下測試時,發現此法不起作用,最後透過查閱資料發現另外一個方法。將city[i].innerText 改為 city[i].text即可。這種方法對IE及FIXEFOX都適用!
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn