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

MX你不懂

MX你不懂

2016-02-19 15:44

下面这个jquery 将disabled的元素置为enabled的三种方法教程由图老师小编精心推荐选出,过程简单易学超容易上手,喜欢就要赶紧get起来哦!
这里发现可以采用三种的变通方法将置为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
buttondisabledNull/button
input type="text" value="input something into me!" size="40"/
br/
buttondisabledRemove/button
input type="text" value="input something into me!" size="40"/
br/
buttondisabledState/button
input type="text" value="input something into me!" size="40"/
/body
/html
展开更多 50%)
分享

猜你喜欢

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

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

jQuery的三种$()

Web开发
jQuery的三种$()

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

治疗便秘的三种方法

电脑网络
治疗便秘的三种方法

快速打开WORD的三种方法

办公软件
快速打开WORD的三种方法

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

iphoneSE死机重启的三种方法

iphone iPhone 5s iPhone 6 iphone刷机
iphoneSE死机重启的三种方法

治疗便秘三种方法

电脑网络
治疗便秘三种方法

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

JQuery 学习笔记 选择器之四

JQuery 学习笔记 选择器之四

使用命令行导入导出方案(oracle)

使用命令行导入导出方案(oracle)
下拉加载更多内容 ↓