實現 select中指定option選中…
阿新 • • 發佈:2018-12-31
我們在用到下拉列表框select時,需要對選中的
選項觸發事件,其實本身沒有觸發事件方法,我們只有在select裡的onchange方法裡觸發。 當我們觸發select的雙擊事件時,用ondblclick方法。 當我們要取得select的選中事件時,用document.all['name'].value來獲取,其中name是select的名稱。 如果我們要得到select的全部的值就用一個for迴圈來實現。程式碼如下: var vi = document.all['list'].length; for(var i=0;i document.form2.list(i).value; //form2是的名稱 } 下面介紹一個特殊情況的解決,由於option本身沒有事件,所以我們不能給每個option都新增一個onclick事件。如果需要實現點選不同的option,實現不同的函式時,要怎麼辦,從value裡取值在分析是一種辦法,但如果value裡的值不確定,我們又不想從value裡取值怎麼辦呢?可以這樣解決,給每個option新增一個屬性,然後在賦一個值,我們在函式裡取到這個屬性的值就可以判斷執行了。 ---------------------------------------------------------------------------------------------<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.getElementByIdx_x("pid");
var grade = objS.options[objS.selectedIndex].grade;
alert(grade);
}
</script>
================jquery=========
1、獲取選中select的value和text,html程式碼如下:
<</SPAN>select id="mySelect"><</SPAN>option value="1">one<</SPAN>/option><</SPAN>option value="2">two<</SPAN>/option><</SPAN>option value="3">three<</SPAN>/則可通過以下script程式碼s來獲取選中的value和text
$("#mySelect").val(); //獲取選中記錄的value值 $("#mySelect option:selected").text(); //獲取選中記錄的text值2、運用new Option("文字","值")方法新增選項option
var obj = document.getElementByIdx_x_x("mySelect");obj.add(new Option("4","4"));3、刪除所有選項option
var obj = document.getElementByIdx_x_x("mySelect");obj.options.length = 0;
4、刪除選中選項option
var obj = document.getElementByIdx_x_x("mySelect");var index = obj.selectedIndex;
obj.options.remove(index);
5、修改選中選項option
var obj = document.getElementByIdx_x_x("mySelect");var index = obj.selectedIndex;
obj.options[index] = new Option("three",3); //更改對應的值obj.options[index].selected = true; //保持選中狀態 6、刪除select var obj = document.getElementByIdx_x_x("mySelect");
obj.parentNode.removeChild(obj); //移除當前物件
7、select選擇的響應事件
$("#mySelect").change(function(){//新增所需要執行的操作程式碼})