Rails4:如何在Rails中使用JQuery禁用基于复选框值的文本字段

Rails 4: How to Disable Text Field Based on Checkbox Value Using JQuery in Rails

本文关键字：复选框 字段 文本 JQuery Rails Rails4      更新时间：2023-09-26

我在表单中有一个复选框和一个文本字段。如果选中复选框，我希望禁用该字段（如果未选中，我希望启用它）。

我试着根据这个问题的第二个答案写一些jQuery：jQuery-复选框启用/禁用

但是，当页面加载时，文本字段is（foo_price）将被禁用，即使该字段未选中。我做错了什么？

我正在使用简单形式宝石：

<%= simple_form_for @foo do |f| %>
  <%= f.input :free_flag, as: :boolean %>
  <%= f.input :price  %>
  <%= f.button :submit %>
<% end %>

表单呈现：

<form>
  <input class="boolean optional" type="checkbox" value="1" name="foo[free_flag]" id="foo_free_flag" />
  <input class="numeric decimal optional" type="number" step="any" value="12.99" name="foo[price]" id="foo_price" />
</form>

我的咖啡描述：

enable_cb = ->
  $('#foo_price').prop 'disabled', !@checked
  return
  $ ->
    enable_cb()
    $('#foo_free_flag').click enable_cb
    return

您可以使用javascript/jquery来完成此操作，请查看此fiddle

<input type = "text" class="txt1"/>
<input type="radio" class="radio1"/>
$(function(){
$(".radio1").change(function(){
alert($(".radio1").prop("checked"));
if($(".radio1").prop("checked") == true){
  $(".txt1").prop("disabled", true);
}else{
    $(".txt1").prop("disabled", false);
}
});
});

当您在DOM上使用enable_cb()时，会直接加载属性checked，它指的是窗口对象，而不是复选框元素

我建议使用change事件而不是click来检查checked属性。您应该使用.trigger(event)以编程方式执行事件处理程序。

enable_cb = ->
  $('#foo_price').prop 'disabled', !@checked
  return
$ ->
    $('#foo_free_flag').change enable_cb 
    .trigger('change')
    return
相关文章：