文本输入框另类效果制作

问 题：
怎样才能使文本输入框变暗无法输入？
我的页面要根据我的选择决定我的文本输入框是否可用。我用单选按钮来选择。当我选择不可用的时候，下面的输入框就会变暗无法输入。请问这种功能能实现吗？

代 码：
<input name="username" id="username" type="text">
<label> <br>
<input type="radio" name="r1" onpropertychange="username.disabled=this.checked">不 可
<input type="radio" name="r1" onClick="onpropertychange="username.disabled=!this.checked"" checked>可 用