網頁設計時,如果遇到數據提交或一些其它功能的觸發,為了防止用戶重復點擊。我們就需要讓用戶在點擊某個按鈕后,讓按鈕處于禁用不可點擊的存在。今天這篇文章就說說,在利用js和JQ兩種方法,使按鈕被點擊一次后處于禁用狀態。

js設置按鈕禁用,js和jquery設置disabled屬性為true使按鈕失效

原生JS禁用按鈕代碼

HTML代碼

<input type="button" value="點我點我" onclick="dis()"  id="mochu">

javascript代碼

<script>
function dis(){
    //飛鳥慕魚博客
    var but = document.getElementById('mochu').disabled = true;
}
</script>

這段代碼的實現原理很簡單,直接將按鈕元素的‘disabled’屬性的值改為‘true’即可。簡單方便

国产视频app注意,html代碼中的 'onclick' 方法,直接調用定義好的函數。 

利用jq禁用按鈕的代碼

html代碼

<input type="button" value="點我點我" id="mochu">

JQ代碼

<script>
$('#mochu').click(function(){
    $(this).attr("disabled", "disabled");
});
</script>

注意:

1、使用此代碼前要引入jquery庫,不然js代碼無法運行

2、此示例中的html代碼與上個事例中的html代碼有所不同,此事件沒有 'onclick' 方法

3、JQ原來就是給元素添加‘disabled’屬性