① 如何使用js獲取下拉列表框的顯示值
js獲取下拉列表框文本值,例如下面的HTML代碼:
<selectonchange="isSelected(this.value);"id="city">
<option
value="1">北京</option>
<optionvalue="2">上海</option>
<optionvalue="2">廣州</option>
</select>
也就是說當用戶選擇「上海」這一列時,需要將「上海」這個名稱保存起來。其實方法很簡單。看下面javascript代碼:
functionisSelected(value){
varcityName;
varcity=
document.getElementById("city");
//獲取選中的城市名稱
for(i=0;i<city.length;i++){
if(city[i].selected==true){
cityName
=city[i].innerText;//關鍵點
alert("cityName:"+cityName);
}
}
也可以這樣做:
functionisSelected(value){
varcity=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都適用!
② 關於js的onchange方法。
javascript onchange()事件:javascript onchange()事件一般用於用戶表單中,例如:當文本框內容發生改變時觸發的事件,或者下拉列表框內容發生改變時觸發的事件等。
示例分享:onchange()事件,用戶輸入時,將小寫字母轉換為大寫。
此處用到了javascript中的一個方法 toUpperCase(); //將小寫母轉換為大寫字母。
<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8"/>
<title>用戶表單驗證</title>
<script>
functionchangeValue(){
varuserName=document.getElementById("userName");//通過Id獲得對象userName;
userName.value=userName.value.toUpperCase();//將對象的值進行大小寫的轉換賦值給當前對象的值;
}
</script>
</head>
<body>
<formname="myform"method="POST"action="register.php"onsubmit="returncheckForm();">
userName:<inputtype="text"name="userName"value=""id="userName"onchange="changeValue();"/><br/>
<inputtype="submit"name=""value="用戶注冊"/>
</form>
</body>
</html>
③ 怎樣用js取得select下拉列表框內選中的option的value值呢
單選下拉列表框對象的value屬性值就是選中項的value值,因此只需用如下代碼即可
var selected_val = document.getElementById(select_id).value;
並且,通過操作select下的option也可以得到被選項的value值,方法為:
var sel = document.getElementById(select_id);
var selected_val = sel.options[sel.selectedIndex].value;
④ 如何控制文本框只能輸入整數並且整數不能大於6,用javascript或者jquery實現,急啊,求大神幫助!
不知道樓主是要一位整數還是多位,我這個代碼是多位的。如果要一位整數,樓主直接用 下拉列表框(select) 就好了。
<body>
<input type="text" id="test">
</body>
<script type="text/javascript" src="Inc/jquery.js"></script>
<script type="text/javascript">
$(function(){
$("#test").keyup(function(){
var str=$(this).val();
var newstr='';
for(i=0;i<str.length;i++){
var j=str.charCodeAt(i);
if(j>47&&j<55){ newstr+=String.fromCharCode(j); }
}
if( newstr.charCodeAt(0)==48 ){ $(this).val(newstr.substr(1,newstr.length)); }
else{ $(this).val(newstr); }
});
})
</script>
⑤ JS實現select選中option觸發事件操作示例
本文實例講述了JS實現select選中option觸發事件操作。分享給大家供大家參考,具體如下:
我們在用到下拉列表框select時,需要對選中的<option>選項觸發事件,其實<option>本身沒有觸發事件方法,我們只有在select里的onchange方法里觸發。
想添加一個option的觸發事件,在option中添加onclick 點來點去就是不會觸發事件
又在select中添加onclick 這下可好了,沒選option呢就觸發了
網路來的說option沒有觸發事件,需要在select中加onchange事件,雖然我曾經處理過類似的問題,用過就忘是不是豬腦子.
這次記住了吧應該
當我們觸發select的雙擊事件時,用ondblclick方法。
當我們要取得select的選中事件時,用document.all['name'].value來獲取,其中name是select的名稱。
如果我們要得到select的全部的值就用一個for循環來實現。代碼如下:
var vi = document.all['list'].length;for(var i=0;i<vi;i++){ document.form2.list(i).value; //form2是<form>的名稱}
JS實現代碼:
<select id="pid" onchange="gradeChange()"> <option grade="1" value="a">選項一</a> <option grade="2" value="b">選項二</a></select><script type="text/JavaScript"> function gradeChange(){ var objS = document.getElementById("pid"); var grade = objS.options[objS.selectedIndex].grade; alert(grade); }</script>
jQuery實現代碼:
<select name="myselect" id="myselect"> <option value="opt1">選項1</option> <option value="opt2">選項2</option> <option value="opt3">選項3</option></select>$("#myselect").change(function(){ var opt=$("#myselect").val(); .});
Javascript獲取select下拉框選中的值
現在有一id=test的下拉框,怎麼拿到選中的那個值呢?
分別使用javascript原生的方法和jquery方法
<select id="test" name=""> <option value="1">text1</option> <option value="2">text2</option></select>
代碼:
一、javascript原生的方法
1. 拿到select對象:
var myselect=document.getElementById("test");
2. 拿到選中項的索引:
var index=myselect.selectedIndex;// selectedIndex代表的是你所選中項的index
3. 拿到選中項options的value:
myselect.options[index].value;
4:拿到選中項options的text:
myselect.options[index].text;
二、jquery方法(前提是已經載入了jquery庫)
1.獲取選中的項
var options=$("#test option:selected");
2.拿到選中項的值
alert(options.val());
3.拿到選中項的文本alert(options.text());