Read Only Text Column With Checkbox

时间:2018-03-09 19:19:12

标签: javascript html checkbox

I made a very easy one HTML input column. I added JavaScript to it with a checkbox in it. When I clicked check box checked I want write the text or unchecked the text box read only how to solve my problem. Give for example for my code

<input type="text" id="inputID" value="abc"></input>

    <input type="checkbox" id="myCheck" checked>

    <script>
   document.getElementById('inputID').readOnly = true;

    </script>

1 个答案:

答案 0 :(得分:1)

Add an event listener to the change event on the checkbox.

<input type="text" id="inputID" value="abc" readonly></input>
<input type="checkbox" id="myCheck" >
<script>
    var checkbox = document.getElementById('myCheck');
    checkbox.addEventListener('change', function() {
        document.getElementById('inputID').readOnly = !this.checked; 
    });
</script>

Working fiddle