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 相关文章推荐
js综合应用实例简单的表格统计
Sep 03 Javascript
document.write的几点使用心得
May 14 Javascript
coffeescript使用的方式汇总
Aug 05 Javascript
JS模拟酷狗音乐播放器收缩折叠关闭效果代码
Oct 29 Javascript
jQuery滚动加载图片实现原理
Dec 14 Javascript
jQuery实现每隔几条元素增加1条线的方法
Jun 27 Javascript
D3.js实现散点图和气泡图的方法详解
Sep 21 Javascript
bootstrap侧边栏圆点导航
Jan 11 Javascript
Web 开发中Ajax的Session 超时处理方法
Jan 19 Javascript
微信小程序开发图片拖拽实例详解
May 05 Javascript
javascript 开发之网页兼容各种浏览器
Sep 28 Javascript
vue在使用ECharts时的异步更新和数据加载详解
Nov 22 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
phpinfo 系统查看参数函数代码
2009/06/05 PHP
把1316这个数表示成两个数的和,其中一个为13的倍数,另一个是11的倍数,求这两个数。
2011/06/24 PHP
PHP开发框架kohana3 自定义路由设置示例
2014/07/14 PHP
DEDE实现转跳属性文档在模板上调用出转跳地址
2016/11/04 PHP
javascript 建设银行登陆键盘
2008/06/10 Javascript
javascript 一些用法小结
2009/09/11 Javascript
jquery 全局AJAX事件使用代码
2010/11/05 Javascript
JS 退出系统并跳转到登录界面的实现代码
2013/06/29 Javascript
使用documentElement正确取得当前可见区域的大小
2014/07/25 Javascript
jquery幻灯片插件bxslider样式改进实例
2014/10/15 Javascript
node.js下LDAP查询实例分享
2015/09/30 Javascript
JS定时检测任务任务完成后执行下一步的解决办法
2016/12/22 Javascript
Redux 和 Mobx的选择问题:让你不再困惑!
2017/09/18 Javascript
node.js学习之断言assert的使用示例
2017/09/28 Javascript
webpack vue 项目打包生成的文件,资源文件报404问题的修复方法(总结篇)
2018/01/09 Javascript
在vue项目中引用Antv G2,以饼图为例讲解
2020/10/28 Javascript
vue 数据操作相关总结
2020/12/17 Vue.js
Python 自动补全(vim)
2014/11/30 Python
python面向对象多线程爬虫爬取搜狐页面的实例代码
2018/05/31 Python
使用python3实现操作串口详解
2019/01/01 Python
在Pycharm中对代码进行注释和缩进的方法详解
2019/01/20 Python
使用批处理脚本自动生成并上传NuGet包(操作方法)
2019/11/19 Python
如何使用scrapy中的ItemLoader提取数据
2020/09/30 Python
HTML5离线缓存Manifest是什么
2016/03/09 HTML / CSS
处理HTML5新标签的浏览器兼容版问题
2017/03/13 HTML / CSS
AmazeUI中模态框的实现
2020/08/19 HTML / CSS
Jabra捷波朗美国官网:用于办公、车载和运动的无线蓝牙耳麦
2017/02/01 全球购物
Linux如何压缩可执行文件
2013/10/21 面试题
小学教师的自我评价范例
2013/10/31 职场文书
安全生产目标责任书
2014/04/14 职场文书
协议书格式
2014/04/23 职场文书
幼儿园亲子活动总结
2014/04/26 职场文书
篮球社团活动总结
2014/06/27 职场文书
借条格式范本
2015/05/25 职场文书
如何写一份具有法律效力的借款协议书?
2019/07/02 职场文书
Centos7 Shell编程之正则表达式、文本处理工具详解
2022/08/05 Servers