Javascript：勾選CheckBox並啟用Button按鈕

這是一個蠻常見到的應用，當使用者勾選了已經閱讀／已經同意的確認方框後，才可以去點選某按鈕進行其他的行為動作。這篇文章就是將這個後端的Javascript記錄下來，以後要用到可以馬上提取。

Step 1. 建立按鈕HTML以及CheckBox勾選方框，其中按鈕部分將其預設Disabled。

<button type="button" id="uExport" class="btn btn-lg btn-success" disabled>匯出資料</button>
<input id="uHadRead" type="checkbox" value="1"> 我已閱讀聲明

Step 2. 建立jQuery事件，掛載在CheckBox下。

$(function () {
  $("#uHadRead").click(function () {
    $("#uExport").prop("disabled", !$("#uHadRead:checked").length);
  });
});

範例展示

匯出資料 我已閱讀聲明 (勾選方可匯出資料)

Javascript HTML CheckBox Checked Enable Disable Button