我们在开发应用程序的时候,经常会遇到这样的需求:用户点击按钮后就让按钮不可再点击,这样可以防止因为用户连续点击按钮导致数据重复的问题,那么该如何实现这样的功能呢?
要实现这种功能,可以有以下一些方式:
1.使用js实现
通过对按钮添加disabled样式属性实现,具体代码如下:
$("#btnSendCode").click(function(){
$("#btnSendCode").removeAttr("disabled"); //开始执行代码禁用按钮
DoSomething();//处理相关逻辑
$("#btnSendCode").attr({ "disabled": "true" }); //执行完成后,把按钮重新变为可用
});
2.使用bootstrap等三方插件
像bootstrap这种前端框架已经有现成的禁用按钮的功能,你只要在点击按钮后给按钮加个disabled属性就可以了
<button type="button" class="btn btn-default btn-lg" disabled="disabled">Button</button>