最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
Bootstrap中点击后禁用按钮的最佳方法
时间:2022-06-25 17:32:04 编辑:袖梨 来源:一聚教程网
为了防止在Bootstrap中点击按钮多次提交,所以希望点击按钮后禁用按钮。
具体实现方法如下:
//禁用button
$('button').addClass('disabled'); // Disables visually
$('button').prop('disabled', true); // Disables visually + functionally
//禁用类型为button的input按钮
$('input[type=button]').addClass('disabled'); // Disables visually
$('input[type=button]').prop('disabled', true); // Disables visually + functionally
//禁用超链接
$('a').addClass('disabled'); // Disables visually
$('a').prop('disabled', true); // Does nothing
$('a').attr('disabled', 'disabled'); // Disables visually
将上面方法写入点击事件中即可,如:
$(".btn-check").click(function () {
$('button').addClass('disabled'); // Disables visually
$('button').prop('disabled', true); // Disables visually + functionally
});
js按钮点击后几秒内不可用
function timer(time) {
var btn = $("#sendButton");
btn.attr("disabled", true); //按钮禁止点击
btn.val(time <= 0 ? "发送动态密码" : ("" + (time) + "秒后可发送"));
var hander = setInterval(function() {
if (time <= 0) {
clearInterval(hander); //清除倒计时
btn.val("发送动态密码");
btn.attr("disabled", false);
return false;
}else {
btn.val("" + (time--) + "秒后可发送");
}
}, 1000);
}
//调用方法
timer(30);
相关文章
- 九牧之野董卓反击盾阵容玩法攻略 12-15
- TikTok国际版官网下载入口-安全访问全球版TikTok 12-15
- 新三国志曹操传马超无双试炼四通关攻略 12-15
- 俄罗斯YANDEX引擎官网入口-免登录直达Yandex首页 12-15
- 漫蛙ManWa在线免费阅读入口_漫蛙ManWa官方网页版一键直达 12-15
- 逃离鸭科夫仓库区地窖在哪 仓库区地窖入口位置详情 12-15