Rails select_tag - jQuery / JavaScript隐藏/显示更改事件

时间:2015-12-03 10:01:43

标签: javascript jquery ruby-on-rails ruby-on-rails-4

我在帮手中有以下内容:

def cancellation_policies_options_for_elite(room)
  options_for_select( [ [t("cancellation_policies.standard"), "standard"], [t("cancellation_policies.moderate"), "moderate"], [t("cancellation_policies.strict"), "strict"], [t("cancellation_policies.elite"), "elite"], [t("cancellation_policies.super_elite"), "super_elite"]] )
end

既指定了在选择菜单中呈现的文本,又指定了值(即标准,中等等)

在我看来,我打电话给:

<%= select_tag('selected_cancellation_policy_id', cancellation_policies_options_for_elite(@room), id: 'select-policy', class: 'input-xxlarge') %>

在此之下,我有以下div:

<div id="moderate" class="policies" style="display:none">
  Moderate policy
</div>

<div id="strict" class="policies" style="display:none">
  Strict policy
</div>

<div id="elite" class="policies" style="display:none">
  Elite policy
</div>
$("#select-policy").on('change', function() {
  alert("It's working!");
  $('.policies').hide();
  $("#" + $(this).val()).show();
}

我的项目中有jQuery和jQuery UI,并且正在编译所有其他jQuery元素正常工作。但是我从这个功能完全没有回应,完全没有原因。关于这个的任何想法?

1 个答案:

答案 0 :(得分:1)

这应该有效: -

$(document).ready(function(){
    $('.policies').hide();
});

然后在更改选择框时执行以下操作: -

$(document).on('change', '#select-policy', function() {
    alert("It's working!");
    $('.policies').not("#" + $(this).val()).hide();
});

此外,在&#34;精英政策&#34; div,id应该是&#34; super_elite&#34;而不是&#34;精英&#34;。因为在选择框中取消精英值是&#34; super_elite&#34;。此处缺少标准政策div。