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 相关文章推荐
jquery 操作单选框,复选框,下拉列表实现代码
Oct 27 Javascript
JavaScript初学者建议:不要去管浏览器兼容
Feb 04 Javascript
全面解析Bootstrap排版使用方法(文字样式)
Nov 30 Javascript
xmlplus组件设计系列之网格(DataGrid)(10)
May 05 Javascript
Vue.js实现实例搜索应用功能详细代码
Aug 24 Javascript
基于node打包可执行文件工具_Pkg使用心得分享
Jan 24 Javascript
通过 JS 判断页面是否有滚动条的实现方法
Apr 05 Javascript
jQuery内容过滤选择器与子元素过滤选择器用法实例分析
Feb 20 jQuery
bootstrap datepicker的基本使用教程
Jul 09 Javascript
Vue3 源码导读(推荐)
Oct 14 Javascript
Js和VUE实现跑马灯效果
May 25 Javascript
Vue实现指令式动态追加小球动画组件的步骤
Dec 18 Vue.js
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
php 静态变量与自定义常量的使用方法
2010/01/26 PHP
DedeCMS dede_channeltype表字段注释
2010/04/07 PHP
php采集时被封ip的解决方法
2010/08/29 PHP
一个基于PDO的数据库操作类(新) 一个PDO事务实例
2011/07/03 PHP
PHP Class&amp;Object -- PHP 自排序二叉树的深入解析
2013/06/25 PHP
利用php输出不同的心形图案
2016/04/22 PHP
PHP基于新浪IP库获取IP详细地址的方法
2017/05/04 PHP
PHP中如何使用Redis接管文件存储Session详解
2018/11/28 PHP
ff下JQuery无法监听input的keyup事件的解决方法
2013/12/12 Javascript
微信小程序实现弹出菜单功能
2018/06/12 Javascript
解决webpack dev-server不能匹配post请求的问题
2018/08/24 Javascript
解决Vue 项目打包后favicon无法正常显示的问题
2018/09/01 Javascript
浅谈Angular7 项目开发总结
2018/12/19 Javascript
laydate只显示时分 不显示秒的功能实现方法
2019/09/28 Javascript
浅谈vue获得后台数据无法显示到table上面的坑
2020/08/13 Javascript
Vue实现购物小球抛物线的方法实例
2020/11/22 Vue.js
[01:10:57]Liquid vs OG 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
pytyon 带有重复的全排列
2013/08/13 Python
详解python之配置日志的几种方式
2017/05/22 Python
Python实现一个服务器监听多个客户端请求
2018/04/12 Python
Python切片索引用法示例
2018/05/15 Python
对Python 中矩阵或者数组相减的法则详解
2019/08/26 Python
Python序列类型的打包和解包实例
2019/12/21 Python
Python vtk读取并显示dicom文件示例
2020/01/13 Python
python:删除离群值操作(每一行为一类数据)
2020/06/08 Python
pytorch 计算Parameter和FLOP的操作
2021/03/04 Python
匡威俄罗斯官网:Converse俄罗斯
2020/05/09 全球购物
思想品德自我鉴定
2013/10/12 职场文书
中文专业毕业生自荐书范文
2014/01/04 职场文书
三年级数学教学反思
2014/01/31 职场文书
策划创业计划书
2014/02/06 职场文书
保密协议书范本
2014/04/22 职场文书
中秋晚会活动方案
2014/08/31 职场文书
2014年银行员工工作总结
2014/11/12 职场文书
干部个人考察材料
2014/12/24 职场文书
vue前端工程的搭建
2021/03/31 Vue.js