當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
JQuery/JS select标签动态设置选中值、设置禁止选择 button按钮禁止点击 select获取选中值...
生活随笔
收集整理的這篇文章主要介紹了
JQuery/JS select标签动态设置选中值、设置禁止选择 button按钮禁止点击 select获取选中值...
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
?
//**1、設置選中值:(根據索引確定選中值)**// var osel=document.getElementById("selID"); //得到select的IDvar opts=osel.getElementsByTagName("option");//得到數組optionvar obt=document.getElementById("bt");obt.onclick=function(){opts[3].selected=true;//設置option第4個元素,即value="3"為默認選中 } //**2、通過原生JS來實現設置選中值,(根據value值確定選中值)**///** * 設置select控件選中 * @param selectId select的id值 * @param checkValue 選中option的值 //實際情況中可能不是options,而是context,具體自定 */ function set_select_checked(selID, checkValue){ var select = document.getElementById(selID); for (var i = 0; i < select.options.length; i++){ if (select.options[i].value == checkValue){ select.options[i].selected = true; break; } } }//**3、設置禁止選擇:**// $("#selectId").attr("disabled", "disabled"); $("#selectId").attr("style", "background-color: #EEEEEE;");//設為灰色,看起來更像不能操作的按鈕//**4、按鈕禁止點擊**// $('#buttonId').attr("disabled", true); $("#buttonId").attr("style", "background-color: #EEEEEE;");//設為灰色,看起來更像不能操作的按鈕實例:
<!---省略部分代碼---> <tbody><tr class="firstRow"><td valign="top" style="word-break: break-all; width: 20%;" rowspan="1" colspan="1"><select id="mekeupType" onchange="MekeupTypeChange();"><option value="moneyWay">貨幣補償</option><option value="houseWay">房屋補償</option></select> </td><td valign="top" style="word-break: break-all; width: 50%;" rowspan="1" colspan="1"><input type="button" value="計算" id="buttonCount" onclick="buttonCountClick();" style="background-color: #339999; color: white;border-color: #339999"" /> <input type="button" value="協議打印" id="buttonPoint" onclick="Painting()" style="background-color: #339999; color: white;border-color: #339999""/> <input type="button" value="簽約確認" id="buttonSign" onclick="Sign()" style="background-color: #339999; color: white;border-color: #339999"/>@*<input type="button" value="返回列表" id="buttonBack" onclick="GoBackList();"/>*@</td><td width="189" valign="top"></td><td width="189" valign="top"></td><td width="189" valign="top"></td><td width="189" valign="top"></td></tr></tbody> </table> <!---省略部分代碼---><script> $(document).ready(function () {//*****省略部分代碼*****//var mekeupel = document.getElementById("mekeupType"); //得到select的IDvar opts = mekeupel.getElementsByTagName("option");//得到數組optionif (compensationMethod.toLowerCase() == "null") {//null//null }else if (compensationMethod.toLowerCase() == "33c3e03a-3bb6-4147-87bd-4c77b84d615b".toLowerCase()) //貨幣 {opts[0].selected = true;//設置option第1個元素 }else if (compensationMethod.toLowerCase() == "c80ea27b-2d11-4e7d-8d6e-65d2b5210d8a".toLowerCase()) //產權置換 {opts[1].selected = true;//設置option第1個元素 }IsSign = parseInt(data[0]["issign"]);if (1 == IsSign) {//設置安置補償方式禁止選擇//disabled="disabled"//background-color: #EEEEEE; $("#mekeupType").attr("disabled", "disabled");$("#mekeupType").attr("style", "background-color: #EEEEEE;");//設置計算按鈕、簽約確認按鈕 禁止click $('#buttonCount').attr("disabled", true);$("#buttonCount").attr("style", "background-color: #EEEEEE;");$('#buttonSign').attr("disabled", true);$("#buttonSign").attr("style", "background-color: #EEEEEE;");} else {} //*****省略部分代碼*****// });</script>獲取select選中值
var select = document.getElementById("HouseType");var index = select.selectedIndex; // 選中索引var text = select.options[index].text; // 選中文本var value = select.options[index].value;//選中值//document.getElementById("ZSGYTD_HouseInfo.HouseType").value = value;?
?
?
?
?
select用法拓展閱讀:select用法大全
?
轉載于:https://www.cnblogs.com/dyhao/p/10028052.html
總結
以上是生活随笔為你收集整理的JQuery/JS select标签动态设置选中值、设置禁止选择 button按钮禁止点击 select获取选中值...的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Void void Void用在泛型
- 下一篇: koa2第一天