关于控制下拉框只读的js控制

文本框有readonly属性,直接设置;下拉框没有readonly属性,也不能通过其他属性进行只读的设置,下拉框只有disabled属性,但是这个属性设成true之后,值就获取不到了;

我在网上搜了一下,大部分是控制鼠标、键盘事件,来控制只读的(即:不让下拉框获取焦点)

代码如下:

<span onmousemove="this.setCapture();" onmouseout="this.releaseCapture();" onfocus="this.blur();">
<select >
<option>1 </option>
<option selected>2 </option>
</select>
</span>

其中onmousemove="this.setCapture();" onmouseout="this.releaseCapture();" 屏蔽了鼠标事件,

onfocus="this.blur();"屏蔽了键盘事件,onfocus="this.blur();"表示该对象将获得焦点时就让它失去焦点,按键盘的TAB键时跳过它,使下一个控件获得焦点。

方法二:

其实也可以通过锁定下拉框的值,来控制(另外,顺便添加了一个灰色的背景色)

代码如下:

<script>
var hxj="field6161";
var hxj_index=document.getElementById(hxj).selectedIndex;
jQuery(document).ready(function() {
     setSelectRead(hxj,hxj_index);
});
function setSelectRead(field_r,param){
   var obj=document.getElementById(field_r);
   jQuery("#"+field_r).css("background-color","#DCDCDC");
   jQuery("#"+field_r).bind("click",function(){
         this.selectedIndex =param;
   });
)
</script>
时间: 2024-10-14 14:22:31

关于控制下拉框只读的js控制的相关文章

用JS和C#分别在前端和后端控制下拉框为只读的方法的代码

代码期间,将写代码过程较好的代码段备份一次,下面资料是关于用JS和C#分别在前端和后端控制下拉框为只读的方法的代码,应该对各位朋友有较大用途. <HTML> <HEAD> <TITLE>下拉框模拟只读</TITLE> <script type="text/javascript"> function setReadOnly(obj_id){ var obj = document.getElementById(obj_id); o

下拉框点链接js

$("#input_text").click(function(){ $("#input_fonts").show(); }); $("#input_fonts").hover( function () { $(this).show(); }, function () { $(this).hide(); } ); 下拉框点链接js

地址下拉框,需要js级联js

function area() { _url = "/ashx/DropDownControl.ashx"; _swType = "GetArea"; _z = ["#province", "#city", "#conty"]; _zo = ["#province > option[value!=-1]", "#city > option[value!=-1]&qu

快速解决js开发下拉框中blur与click冲突

在开发中我们会经常遇到blur和click冲突的情况.下面叙述了开发中常遇到的"下拉框"的问题,并提供了两种解决方案. 一.blur和click事件简述 blur事件:当元素失去焦点时触发blur事件:其为表单事件,blur和focus事件不会冒泡,其他表单事件都可以.click事件:当点击元素时触发click事件:所有元素都有此事件,会产生冒泡. 示例1:blur事件为表单事件 1 2 3 4 5 6 7 8 9 10 11 12 13 <input type="te

vue.js实现单选框、复选框和下拉框

Vue.js可以很方便的实现数据双向绑定,所以在处理表单,人机交互方面具有很大的优势.下边以单选框.复选框和下拉框为例介绍他们在HTML和Vue.js中的具体实现方式. 一.单选框 在传统的HTML中实现单选框的方法如下: <div id="app"> <input type="radio" name="gender" value="man" id="man"/><label

js设置下拉框选中后change事件无效解决

下拉框部分代码: <select id="bigType"> <option value="">请选择</option> <option value="1">xiamen</option> <option value="2">beijing</option> </select> <select id="smallTy

js,jquery获取下拉框选中的option

js获取select选中的值: var sel=document.getElementById("select1"); var index = sel.selectedIndex; // 选中索引 albumid= sel.options[index].value;//要的值 jQuery获取下拉框选中的option: $("#s option:selected").val();

一点点关于JS的东西:EasyUI布局+下拉框之个人简单使用

根据项目需要,自己写的一个小小demo:实现的简单效果是这样子的,通过下拉框选择数据项,点击页面Button触发,根据下拉框值加载选显卡Tbs. html代码如下: 一个下拉框,一个button,一个空的tbs,两个隐藏内容div(可以动态合成). <select id="Model" class="easyui-combobox" name="Model" style="width:250px;">      

Html下拉框的定义以及JS、Jquary取值、添加和移除

现在有一id=test的下拉框,怎么拿到选中的那个值呢? 分别使用javascript原生的方法和jquery方法 <select id="test"  name="" multiply="multiply" size="10">   //multiply设置可以多行显示,size设置默认显示多少行.  <option   value="1">text1</option>