为超链接加上disabled后的故事
场情:
一张页面中原来有一个超链接按钮,点击后可以获取到短信认证码。如
代码如下:
<a href="javascript:reciverSms()">获取短信认证码</a>
<script type="text/javascript">
function reciverSms(){
var sms = getSmsCode();
}
</script>
但是考虑到频繁点击获取认证码,对相关设备的压力,就做了一个点击5秒后才允许再点击的逻辑,于是又来了下一个版本
代码如下:
function reciverSms(obj){
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);
}
至此这个功能因该是算做好了,可是还有一件令我想不的事,之前说超连接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);
}
通过一步步的改进,一个芝麻功能终于完成了。例子虽小,但却给了我很多思考。
相关推荐
-
JQuery设置和去除disabled属性的5种方法总结
复制代码 代码如下: //两种方法设置disabled属性 $('#areaSelect').attr("disabled",true); $('#areaSelect').attr("disabled","disabled"); //三种方法移除disabled属性 $('#areaSelect').attr("disabled",false); $('#areaSelect').removeAttr("disab
-
jquery 将disabled的元素置为enabled的三种方法
这里发现可以采用三种的变通方法将置为disabled的元素状态改为enabled. 第一种:改变disabled的boolean状态,具体代码及解释如下: 复制代码 代码如下: $("button:eq(2)").click(function(){ var text2=$("input:text:eq(2)"); if(text2.attr("disabled")==false){ //通过设置disabled的boolean属性将第三个text
-
为超链接加上disabled后的故事
场情: 一张页面中原来有一个超链接按钮,点击后可以获取到短信认证码.如 复制代码 代码如下: <a href="javascript:reciverSms()">获取短信认证码</a> <script type="text/javascript"> function reciverSms(){ var sms = getSmsCode(); } </script> 但是考虑到频繁点击获取认证码,对相关设备的压力,就做了
-
超链接的禁用属性Disabled使用示例
可以设置超链接的Disabled属性的true 和 false来确定超链接是不是能点击 例如: <a herf='http://www.baidu.com' onclick='return click(this);' disabled='ture'>bai du</a> 上面的意思是不想让bai du的超链生效,但在click不做任何约束和判断的话,但点击bai du的时候自然就会跳转到百度页面,这就是html中超链接禁用属性的bug 可以添加下面js约束来判断超链接是否可以使用
-
表单中Readonly和Disabled的区别详解
Readonly和Disabled是用在表单中的两个属性,它们都能够做到使用户不能够更改表单域中的内容.但是它们之间有着微小的差别,总结如下: Readonly只针对input(text / password)和textarea有效,而disabled对于所有的表单元素都有效,包括select, radio, checkbox, button等. 但是表单元素在使用了disabled后,当我们将表单以POST或GET的方式提交的话,这个元素的值不会被传递出去,而readonly会将该值传递出去(
-
javascript中input中readonly和disabled区别介绍
Readonly和Disabled是用在表单中的两个属性,它们都能够做到使用户不能够更改表单域中的内容.但是它们之间有着微小的差别,总结如下: Readonly只针对input(text / password)和textarea有效,而disabled对于所有的表单元素都有效,包括select, radio, checkbox, button等.但是表单元素在使用了disabled后,当我们将表单以POST或GET的方式提交的话,这个元素的值不会被传递出去,而 readonly会将该值传递出去(
-
Java计算一个数加上100是完全平方数,加上168还是完全平方数
题目:一个整数,它加上100后是一个完全平方数,加上168又是一个完全平方数,请问该数是多少? 程序分析:在10万以内判断,先将该数加上100后再开方,再将该数加上268后再开方,如果开方后的结果满足如下条件,即是结果.请看具体分析: 程序设计: public class test { public static void main (String[]args){ long k=0; for(k=1;k<=100000l;k++) if(Math.floor(Math.sqrt(k+100))=
-
使用jQuery设置disabled属性与移除disabled属性
表单中readOnly和disabled的区别: Readonly只针对input(text/ password)和textarea有效,而disabled对于所有的表单元素都有效,包括select,radio, checkbox, button等. 但是表单元素在使用了disabled后,当我们将表单以POST或GET的方式提交的话,这个元素的值不会被传递出去,而readonly会将该值传递出去(这种情况出现在我们将某个表单中的textarea元素设置为disabled或readonly,但是
-
一个不错的优化系统的批处理
复制代码 代码如下: ~~~~~~~~~~~~~~~~~~~~无敌分割线~~~~~~~~~~~~~~~~~~~~~~~~ @echo off title Windows Xp超级优化工具 VER 2.5 由VCTU鼎力制作! MODE con: COLS=70 LINES=35 :begin MODE con: COLS=70 LINES=35 cls color 0a echo. echo Xp超级优化工具 VER 2.5 echo. echo VCTU/julian.邪鬼
-
浅谈mysql密码遗忘和登陆报错的问题
mysql登录密码忘记,其实解决办法很简单,只需要在mysql的主配置文件my.cnf里添加一行"跳过授权表"的参数选择即可! 在my.cnf中添加下面一行: [root@test-huanqiu ~]# vim /etc/my.cnf //在[mysqld]区域里添加 ........ skip-grant-tables //跳过授权表 然后重启mysql服务,即可无密码登录 [root@test-huanqiu
-
javascript常见操作汇总
本文整理汇总了javascript常见的各类操作,包括字符串.时间.表单.正则验证等等.有着极高的参考价值.分享给大家供大家参考之用.具体方法如下: /***** BasePage.js 公共的 脚本文件 部分方法需引用jquery库 *****/ //#region 日期操作 //字符串转化为时间. function stringtoTime(date1) { var dt = new Date(Date.parse(date1.replace(/-/g, "/"))); retur
-
MySQL下常见的启动失败与备份失败问题的解决教程
启动失败 重启服务器后-->重启应用服务(Confluence)-->报错,数据库连接失败(mysql设置了开机自启动)-->查看mysql数据库状态: [root@fisheye ~]# ps -ef | grep mysql root 25555 21974 0 11:28 pts/0 00:00:00 grep mysql 启动mysql服务器 [root@fisheye data]# service mysql start MySQL server PID file could
随机推荐
- javascript类继承机制的原理分析
- 通过命令行创建vue项目的方法
- Angular 2.0+ 的数据绑定的实现示例
- Struts2中Action中是否需要实现Execute方法
- 去除html代码里面的script正则方法
- php5新改动之短标记启用方法
- PHP环境中Memcache的安装和使用
- C++动态分配和撤销内存以及结构体类型作为函数参数
- CentOS下mysql定时备份Shell脚本分享
- SQLserver2014(ForAlwaysOn)安装图文教程
- 如何应用C++的函数对象
- jquery中animate动画积累的解决方法
- 13个绚丽的Jquery 界面设计网站推荐
- 无法进入远程桌面远程重启WIN2003服务器的方法
- Android开发中给EditText控件添加TextWatcher监听实现对输入字数的限制(推荐)
- Maven的国内镜像(快速解决jar下载过慢的问题)
- java二分查找插入法
- Python的Django框架中forms表单类的使用方法详解
- 用Javascript数组处理多个字符串的连接问题
- 使用位运算实现网页中的过滤、筛选功能实例