HTML使用JS禁用button,js设置按钮禁用，js原生加JQ两种方法

网页设计时，如果遇到数据提交或一些其它功能的触发，为了防止用户重复点击。我们就需要让用户在点击某个按钮后，让按钮处于禁用不可点击的存在。今天这篇文章就说说，在利用js和JQ两种方法，使按钮被点击一次后处于禁用状态。

原生JS禁用按钮代码

HTML代码

javascript代码

function dis(){

//飞鸟慕鱼博客

var but = document.getElementById('mochu').disabled = true;

}

这段代码的实现原理很简单，直接将按钮元素的‘disabled’属性的值改为‘true’即可。简单方便

注意，html代码中的 'onclick' 方法，直接调用定义好的函数。

利用jq禁用按钮的代码

html代码

JQ代码

$('#mochu').click(function(){

$(this).attr("disabled", "disabled");

});

注意：

1、使用此代码前要引入jquery库，不然js代码无法运行

2、此示例中的html代码与上个事例中的html代码有所不同，此事件没有 'onclick' 方法

3、JQ原来就是给元素添加‘disabled’属性