Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/processing.js/1.4.1/processing-api.min.js"></script>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Make input read only</title>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head>
<body>
    <input id="myinput" type="text" />
    <input id="mycheck" type="checkbox" />
    <script type="text/javascript">
        /*oncheck box click*/
        $('#mycheck').click(function () {
            if ($(this).attr('checked')) {
                $('#myinput').attr('readOnly', 'readOnly');
            }
            else {
                $('#myinput').removeAttr('readOnly', 'readOnly');
                /* also tried  $('#myinput').attr('readOnly', false);*/
            }
        });
        /*on text box click*/
        $('#myinput').click(function () {
            $('#mycheck').removeAttr('checked');
            $('#myinput').removeAttr('readOnly', 'readOnly');
            /* also tried  $('#myinput').attr('readOnly', false);*/
        });
    </script>
</body>
</html>
 
saasdf
Output

This bin was created anonymously and its free preview time has expired (learn why). — Get a free unrestricted account

Dismiss x
public
Bin info
anonymouspro
0viewers