我在表单中有一个复选框和一个文本字段。如果选中该复选框,我想要禁用该字段(如果未选中该字段,我希望它已启用)。
我试着根据这个问题的第二个答案写一些jQuery: jQuery - checkbox enable/disable
但是,即使未选中该字段,也会在页面加载时禁用文本字段(foo_price)。我做错了什么?
我正在使用Simple Form gem:
<%= 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>
我的Coffeescript:
enable_cb = ->
$('#foo_price').prop 'disabled', !@checked
return
$ ->
enable_cb()
$('#foo_free_flag').click enable_cb
return
答案 0 :(得分:0)
问题产生于当您在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
答案 1 :(得分:0)
您可以使用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);
}
});
});