jquery 将disabled的元素置为enabled的三种方法


Posted in Javascript onJuly 25, 2009

这里发现可以采用三种的变通方法将置为disabled的元素状态改为enabled。
第一种:改变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 相关文章推荐
javascript动画效果类封装代码
Aug 28 Javascript
jQuery 性能优化指南 (1)
May 21 Javascript
javascript 静态对象和构造函数的使用和公私问题
Mar 02 Javascript
详解 javascript中offsetleft属性的用法
Nov 11 Javascript
jquery.validate提示错误信息位置方法
Jan 22 Javascript
Javascript 5种方法实现过滤删除前后所有空格
Jun 22 Javascript
全面了解javascript三元运算符
Jun 27 Javascript
Node.js connect ECONNREFUSED错误解决办法
Sep 15 Javascript
Ubuntu 16.04 64位中搭建Node.js开发环境教程
Oct 19 Javascript
JS开发中基本数据类型具体有哪几种
Oct 19 Javascript
全面了解JavaScript的作用域链
Apr 03 Javascript
JS实现烟花爆炸效果
Mar 10 Javascript
javaScript 判断字符串是否为数字的简单方法
Jul 25 #Javascript
利用javascript/jquery对上传文件格式过滤的方法
Jul 25 #Javascript
javascript 动态table添加colspan\rowspan 参数的方法
Jul 25 #Javascript
jquery 表单下所有元素的隐藏
Jul 25 #Javascript
运用jquery实现table单双行不同显示并能单行选中
Jul 25 #Javascript
用JQuery 实现AJAX加载XML并解析的脚本
Jul 25 #Javascript
Prototype Selector对象学习
Jul 23 #Javascript
You might like
BBS(php &amp; mysql)完整版(四)
2006/10/09 PHP
Ajax PHP简单入门教程代码
2008/04/25 PHP
php实现加减法验证码代码
2014/02/14 PHP
PHP实现bitmap位图排序与求交集的方法
2016/07/28 PHP
自制PHP框架之模型与数据库
2017/05/07 PHP
PHP registerXPathNamespace()函数讲解
2019/02/03 PHP
php-fpm超时时间设置request_terminate_timeout资源问题分析
2019/09/27 PHP
在laravel中使用with实现动态添加where条件
2019/10/10 PHP
JQuery与iframe交互实现代码
2009/12/24 Javascript
Ubuntu 11.10 安装Node.js的方法
2011/11/30 Javascript
经过绑定元素时会多次触发mouseover和mouseout事件
2014/02/28 Javascript
IE中JS跳转丢失referrer问题的2个解决方法
2014/07/18 Javascript
JS实现很实用的对联广告代码(可自适应高度)
2015/09/18 Javascript
图文详解Heap Sort堆排序算法及JavaScript的代码实现
2016/05/04 Javascript
JQuery动态添加Select的Option元素实现方法
2016/08/29 Javascript
Angularjs使用指令做表单校验的方法
2017/03/31 Javascript
JS+HTML+CSS实现轮播效果
2017/11/28 Javascript
将Sublime Text 3 添加到右键中的简单方法
2017/12/12 Javascript
Angular2使用vscode断点调试ts文件的方法
2017/12/13 Javascript
详解JavaScript对数组操作(添加/删除/截取/排序/倒序)
2019/04/28 Javascript
微信小程序的开发范式BeautyWe.js入门详解
2019/07/10 Javascript
微信小程序工具函数封装
2019/10/28 Javascript
js中forEach,for in,for of循环的用法示例小结
2020/03/14 Javascript
JavaScript闭包原理与用法学习笔记
2020/05/29 Javascript
Vue项目配置跨域访问和代理proxy设置方式
2020/09/08 Javascript
python利用urllib实现爬取京东网站商品图片的爬虫实例
2017/08/24 Python
python购物车程序简单代码
2018/04/18 Python
python数据处理 根据颜色对图片进行分类的方法
2018/12/08 Python
Python3最长回文子串算法示例
2019/03/04 Python
python基于celery实现异步任务周期任务定时任务
2019/12/30 Python
澳大利亚窗帘商店:Curtain Wonderland
2019/12/01 全球购物
电子商务专业推荐信范文
2013/12/02 职场文书
管事部库房保管员岗位职责
2014/02/21 职场文书
大三学生英语考试作弊检讨书
2015/01/01 职场文书
MySQL 百万级数据的4种查询优化方式
2021/06/07 MySQL
微软发布Windows 11今年最大更新22H2(附 ISO 镜像官方下载)
2022/09/23 数码科技