JSFiddle - React, Tailwind, and code Playground

by rwaldron

HTML

<input type="text" id="test" value="Enabled"/>
<button id="enable">Enable</button>
<button id="disable">Disable</button>

<a href="http://google.com">people do stuff like this</a>

JavaScript

// Plugin Code
jQuery.fn.enable = function(){
    return this
        .removeAttr( "disabled" )
        .trigger( "enabled" );
};

jQuery.fn.disable = function(){
    return this
        .attr( "disabled", "disabled" )
        .trigger( "disabled" );
};

jQuery.fn.disabled = function(){
    return !!this.attr( "disabled" );
};

// Example
$("#enable").click(function(){
   $("#test").enable(); 
});

$("#disable").click(function(){
   $("#test").disable();
});

$("#test").bind( "disabled", function() {
    $(this).val( $(this).disabled() ? "Disabled" : "Enabled" );
});

// what happens when users try this?
$("a").disable();

// or this?
$("body").disable();