Run ยป
<!DOCTYPE HTML> <html> <head> <title> Add a readonly attribute to an input field </title> <script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"> </script> </head> <body style = "text-align:center;"> <p style = "font-size: 15px; font-weight: bold;"> Click on the button to add the readonly attribute. </p> <form> Name: <input type="text" name="input_field" /> <br> <button id="submit"> click here </button> </form> <p id = "GFG_down" style = "color: green; font-size: 20px; font-weight: bold;"> </p> <script> $(document).ready(function(){ $("#submit").click(function(){ $('input').attr('readonly', true); document.getElementById("GFG_down").innerHTML = "Read-Only attribute enabled"; }); }); </script> </body> </html>