css disable button

here learn to step by step “css disable button” using JavaScript and jquery with HTML.

jQuery Enable Disable Submit Buttons Example

CSS Code
using “css disable button click”

<button id="btnSubmit" class="btn-css-disable">Get Product Data</button>

<style type="text/css">
    .btn-css-disable
        {
        cursor: not-allowed;
        pointer-events: none;

        /*Buttons disabled - CSS color class*/
        color: #c0c0c0;
        background-color: #ffffff;

        }
</style>

Also Read: Online CSS Buttons Generator

HTML Code
using “html disabled=false”

<button type="button" disabled id="cssBtn">Get Product Data</button>

jQuery and Javascript Source code
Tips: “disable buttons css jquery”

//Using Pure Javascript
//Disabling a html button

document.getElementById("cssBtn").disabled = true;
//simple Js Enabling a html button

document.getElementById("cssBtn").disabled = false;


//Using dynamically jQuery
//Disabling a html buttons

$('#cssBtn').attr('disabled','disabled');
//Enabling a html buttons

$('#cssBtn').removeAttr('disabled');

css Code
using “css disabled class”

button:disabled,
button[disabled]{
  border: 1px solid #999999;
  background-color: #cccccc;
  color: #3d3d3d;
}

Also Read This 👉   How to display current date and time in html using javascript?