jquery改变disabled的boolean状态的三种方法


Posted in Javascript onDecember 13, 2013

第一种:改变disabled的boolean状态,具体代码及解释如下:

代码如下:

$("button:eq(2)").click(function(){ 
var text2=$("input:text:eq(2)"); 
if(text2.attr("disabled")==false){ 
//通过设置disabled的boolean属性将第三个text输入框disabled属性置为true 
text2.attr("disabled",true); 
}else{ 
//通过将第三个text输入框disabled属性置为false来移除disabled属性 
text2.attr("disabled",false); 
} 
});

第二种:移除disabled属性,具体代码及解释如下:

代码如下:

$("button:eq(1)").click(function(){ 
var text2=$("input:text:eq(1)"); 
if(text2.attr("disabled")==false){ 
//通过设置disabled的值将第二个text输入框置为disabled 
text2.attr("disabled","disabled"); 
}else{ 
//通过移除的方式将第二个text输入框的disable属性删除 
text2.removeAttr("disabled"); 
} 
});

第三种:改变disabled的值,具体代码及解释如下:

代码如下:

$("button:eq(0)").click(function(){ 
var text1=$("input:text:eq(0)"); 
if(text1.attr("disabled")==""){ 
// 或者text1.attr("disabled")==false 
//通过设置disabled的值将第一个text输入框置为disabled 
text1.attr("disabled","disabled"); 
}else{ 
//通过覆盖的方式将第一个text输入框中的disabled属性清除掉 
text1.attr("disabled",""); 
} 
});

完整的示例代码如下(已测试通过):
代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> <script src="jquery的路径引入就行了"></script> 
<script type="text/javascript"><!-- 
$(document).ready(function () { 
$("button:eq(0)").click(function () { 
var text1 = $("input:text:eq(0)"); 
if (text1.attr("disabled") == "") { 
// 或者text1.attr("disabled")==false 
//通过设置disabled的值将第一个text输入框置为disabled 
text1.attr("disabled", "disabled"); 
} else { 
//通过覆盖的方式将第一个text输入框中的disabled属性清除掉 
text1.attr("disabled", ""); 
} 
}); 
$("button:eq(1)").click(function () { 
var text2 = $("input:text:eq(1)"); 
if (text2.attr("disabled") == false) { 
//通过设置disabled的值将第二个text输入框置为disabled 
text2.attr("disabled", "disabled"); 
} else { 
//通过移除的方式将第二个text输入框的disable属性删除 
text2.removeAttr("disabled"); 
} 
}); 
$("button:eq(2)").click(function () { 
var text2 = $("input:text:eq(2)"); 
if (text2.attr("disabled") == false) { 
//通过设置disabled的boolean属性将第三个text输入框disabled属性置为true 
text2.attr("disabled", true); 
} else { 
//通过将第三个text输入框disabled属性置为false来移除disabled属性 
text2.attr("disabled", false); 
} 
}); 
}); 
// --></script> 
</head> 
<body> 
<button>disabledNull</button> 
<input type="text" value="input something into me!" size="40"/> 
<br/> 
<button>disabledRemove</button> 
<input type="text" value="input something into me!" size="40"/> 
<br/> 
<button>disabledState</button> 
<input type="text" value="input something into me!" size="40"/> 
</body> 
</html>
Javascript 相关文章推荐
this[] 指的是什么内容 讨论
Mar 24 Javascript
javascript 多级checkbox选择效果
Aug 20 Javascript
Javascript String.replace的妙用
Sep 08 Javascript
flexigrid 类似ext grid的JS表格代码
Jul 17 Javascript
解决jquery版本冲突的有效方法
Sep 02 Javascript
JavaScript中的分号插入机制详细介绍
Feb 11 Javascript
纯HTML5制作围住神经猫游戏-附源码下载
Aug 23 Javascript
js实现跨域访问的三种方法
Dec 09 Javascript
JavaScript实现网页头部进度条刷新
Apr 16 Javascript
解决Vue使用swiper动态加载数据,动态轮播数据显示白屏的问题
Sep 27 Javascript
js实现移动端吸顶效果
Jan 08 Javascript
vscode 插件开发 + vue的操作方法
Jun 05 Javascript
javascript判断两个IP地址是否在同一个网段的实现思路
Dec 13 #Javascript
Extjs4中的分页应用结合前后台
Dec 13 #Javascript
php显示当前文件所在的文件以及文件夹所有文件以树形展开
Dec 13 #Javascript
window.print打印指定div实例代码
Dec 13 #Javascript
Javascript中call的两种用法实例
Dec 13 #Javascript
分享JavaScript获取网页关闭与取消关闭的事件
Dec 13 #Javascript
js获取触发事件元素在整个网页中的绝对坐标(示例代码)
Dec 13 #Javascript
You might like
在PHP中使用curl_init函数的说明
2010/11/02 PHP
Laravel Validator 实现两个或多个字段联合索引唯一
2019/05/08 PHP
彪哥1.1(智能表格)提供下载
2006/09/07 Javascript
Javascript 面向对象 对象(Object)
2010/05/13 Javascript
Chrome中模态对话框showModalDialog返回值问题的解决方法
2010/05/25 Javascript
关于捕获用户何时点击window.onbeforeunload的取消事件
2011/03/06 Javascript
js向上无缝滚动,网站公告效果 具体代码
2013/11/18 Javascript
jquery简单实现滚动条下拉DIV固定在头部不动
2013/11/25 Javascript
javascript作用域和闭包使用详解
2014/04/25 Javascript
JavaScript通过元素索引号删除数组中对应元素的方法
2015/03/18 Javascript
js仿京东轮播效果 选项卡套选项卡使用
2017/01/12 Javascript
JS三目运算(三元运算)方法详解
2017/03/01 Javascript
javascript 中的继承实例详解
2017/05/05 Javascript
基于Vue实例对象的数据选项
2017/08/09 Javascript
vue单个组件实现无限层级多选菜单功能
2018/04/10 Javascript
vue+Vue Router多级侧导航切换路由(页面)的实现代码
2018/12/20 Javascript
JS获取当前时间的年月日时分秒及时间的格式化的方法
2019/12/18 Javascript
vue keep-alive的简单总结
2021/01/25 Vue.js
Python对文件和目录进行操作的方法(file对象/os/os.path/shutil 模块)
2017/05/08 Python
python中Matplotlib实现绘制3D图的示例代码
2017/09/04 Python
python opencv设置摄像头分辨率以及各个参数的方法
2018/04/02 Python
python接口自动化(十六)--参数关联接口后传(详解)
2019/04/16 Python
使用Python的networkx绘制精美网络图教程
2019/11/21 Python
Python3.9 beta2版本发布了,看看这7个新的PEP都是什么
2020/06/10 Python
python中判断文件结束符的具体方法
2020/08/04 Python
详解CSS3:overflow属性
2020/11/17 HTML / CSS
美国钻石商店:Zales
2016/11/20 全球购物
德国古洛迷亚百货官网:GALERIA Kaufhof
2017/06/20 全球购物
幼儿园园长岗位职责
2013/11/26 职场文书
医学院校毕业生自荐信范文
2014/01/01 职场文书
网络工程师职业规划
2014/02/10 职场文书
小班开学寄语
2014/04/04 职场文书
奥运会口号
2014/06/13 职场文书
预备党员学习十八届三中全会精神思想汇报
2014/09/13 职场文书
老人院义工活动感想
2015/08/07 职场文书
预防职务犯罪警示教育心得体会
2016/01/15 职场文书