当前位置: 编程技术>jquery
jquery设置disabled属性为true的方法 超链接加上disabled属性
来源: 互联网 发布时间：2014-10-08
本文导语: 如何将设置disabled属性为true，即为不可用状态，分别用js、jquery与html实现。 例子： //JS document.getElementByIdx("btn").disabled=true; //jquery $("#btn").attr("disabled", true); //html 说到jquery操作disabled属性，我们并不陌生，在之前的几篇...
如何将设置disabled属性为true，即为不可用状态，分别用js、jquery与html实现。
例子：
//JS
document.getElementByIdx("btn").disabled=true;
//jquery
$("#btn").attr("disabled", true);
//html
document.getElementByIdx("btn").disabled=true;
//jquery
$("#btn").attr("disabled", true);
//html
说到jquery操作disabled属性，我们并不陌生，在之前的几篇文章：
- jquery设置元素readonly和disabled(checkbox只读)
- jquery设置元素readonly与disabled属性
- jquery设置元素的readonly和disabled属性
第二部分，为超链接添加disabled属性。
场情：
一张页面中原来有一个超链接按钮，点击后可以获取到短信认证码。
例子：
但是考虑到频繁点击获取认证码，对相关设备的压力，就做了一个点击5秒后才允许再点击的逻辑。
修改为：
function reciverSms(obj){
var sms = getSmsCode();
obj.disabled = true;
windows.setTimeout(function(){
obj.disabled = false;
},5000);
}
var sms = getSmsCode();
obj.disabled = true;
windows.setTimeout(function(){
obj.disabled = false;
},5000);
}
获取一次短信后，链接禁用5秒。可是没有想的事情又来了，原来超链接禁用了后虽然样子变成禁用了，但是还是可以点击的，原来是个陷阱。
第三个版本：
function reciverSms(obj){
if(obj.disabled){
return;
}
var sms = getSmsCode();
obj.disabled = true;
windows.setTimeout(function(){
obj.disabled = false;
},5000);
}
if(obj.disabled){
return;
}
var sms = getSmsCode();
obj.disabled = true;
windows.setTimeout(function(){
obj.disabled = false;
},5000);
}
之前说超连接disabled属性为true时，表现出来的样子是灰色不可用状态，但这里有个特例，如果这个超链接被设置了color的css属性样式，在非ie浏览器上表现出来的样子就不是禁用了，终于看到ie的好了。
第四个版本：
function reciverSms(obj){
if(obj.disabled){
return;
}
var sms = getSmsCode();
obj.disabled = true;
addClass(obj,"gray");
windows.setTimeout(function(){
obj.disabled = false;
removeClass(obj,"gray");
},5000);
}
if(obj.disabled){
return;
}
var sms = getSmsCode();
obj.disabled = true;
addClass(obj,"gray");
windows.setTimeout(function(){
obj.disabled = false;
removeClass(obj,"gray");
},5000);
}
第二部分，jquery让input从disabled变成enabled。
例子：
document.getElementById("removeButton").disabled = false;//普通Js写法
$("#removeButton").removeAttr("disabled");//要变成Enable，JQuery只能这么写
$("#removeButton").attr("disabled","disabled");//再改成disabled
$("#removeButton").removeAttr("disabled");//要变成Enable，JQuery只能这么写
$("#removeButton").attr("disabled","disabled");//再改成disabled
您可能感兴趣的文章:
本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术，将尽最大努力为读者提供更好的信息聚合和浏览方式。
本站(WWW.)站内文章除注明原创外，均为转载、整理或搜集自网络。欢迎任何形式的转载，转载请注明出处。
本站(WWW.)站内文章除注明原创外，均为转载、整理或搜集自网络。欢迎任何形式的转载，转载请注明出处。