在点击检查时禁用并启用文本框

Question

如果选中复选框，则应启用文本框，否则应禁用文本框。

不知道为什么这段代码不起作用？

<script type="text/javascript">
function toggleTB(what){
if(what.checked){document.test.from_address.disabled=1}
else{document.test.from_address.disabled=0}}
</script>

<% form_for(@test,:name => "test") do |f| %>
<table>
        <tr>
            <td class="right upcase none">
              <%= f.label 'text_enabled', "Enable",:class => "capitalize none" %>
              <%= f.check_box :text_enabled,:onclick => "toggleTB(this)" %>
            </td>
        </tr>

        <tr>
            <td class="right upcase none">
              <%= f.label 'from_address', "From Address",:class => "capitalize none" %>
            </td>
            <td>
              <%= f.text_field 'from_address', :maxlength => 16 %>
            </td>
        </tr>
</table>
<% end %>

任何想法？

Answer 1

Try like this

<script type="text/javascript">
   function toggleTB(what){
      if(what.checked){document.getElementById('from_address').disabled=1}
   else{document.getElementById('from_address').disabled=0}}
</script>

<input type="checkbox" name="toggle" onclick="toggleTB(this)"/>
<input type="input" id="from_address" />

Answer 2

尝试设置disabled = true和disabled=false .. text_box的ID也是test_from_address，名称将是test[from_address]。

Answer 3

尝试在第3行的末尾设置disabled=disabled

Answer 4

这对我有用..

<script type="text/javascript">
  <!--
function toggleTB(what){
 document.getElementById("test_from_address").disabled = !what.checked;
}
-->
</script>

<% form_for(@test,:name => "test") do |f| %>
<table>
        <tr>
            <td class="right upcase none">
              <%= f.label 'text_enabled', "Enable",:class => "capitalize none" %>
              <%= f.check_box :text_enabled,:onclick => "toggleTB(this)" %>
            </td>
        </tr>

        <tr>
            <td class="right upcase none">
              <%= f.label 'from_address', "From Address",:class => "capitalize none" %>
            </td>
            <td>
              <%= f.text_field 'from_address', :maxlength => 16 %>
            </td>
        </tr>
</table>
<% end %>

Answer 5

$(function()
    {
        $("#dropdown").change(function()
        {
            if ($(this).val()== "option1")
            {
                $("#textbox1").removeAttr("disabled");
                $("#textbox2").removeAttr("disabled");
            }
            else 
            {
                $("#textbox2").attr("disabled", "disabled");
                $("#textbox2").attr("disabled", "disabled");
            }
        });
        $("#PaymentMode").change(function()
        {
            if ($(this).val()== "option2")
            {
                $("#textbox3").removeAttr("disabled");
                $("#textbox4").removeAttr("disabled");
                $("#textbox5").removeAttr("disabled");
            }
            else
            {
                $("#textbox3").attr("disabled", "disabled");
                $("#textbox4").attr("disabled", "disabled");
                $("#textbox5").attr("disabled", "disabled");
            }
        });
    });