Question

我试图在Rails 3.2应用程序中使用jQuery＆＃39; accordion效果。这是一个简单的屏幕，用户可以选择通过信用卡或PayPal付款。手风琴功能本身确实有效。但是，我无法尊重我在CoffeeScript中初始化它的任何设置：

$('#paymentdiv').accordion ->
  icons: false
  heightStyle: 'content'
  animate: 300

图标仍然显示，高度不足以容纳内容，并且设置动画的内容并不重要，它始终是相同的。

  <div id="paymentdiv">
    <h3><%= image_tag "/img/promo/credit card title.png" %></h3>
    <div id="creditcarddiv">
      <%= simple_form_for @subscription, url: wizard_path, method: :put, html: { class: 'form-horizontal' }, defaults: { label_html: { style: "width:200px;" } } do |f| %>
        <% unless @subscription.errors.blank? %>
          <div class="error_messages">
            <%= f.error_notification message: "We're sorry, but it appears that the information provided is incorrect or incomplete.", style: "color:#b94a48;" %>
            <p>Please verify that the information provided is correct and try again.</p>
          </div>
        <% end %>

        <%= f.input :payment_card_token, as: :hidden %>
        <%= render 'credit_card_fields' %>

        <div id="stripe_error" style="position:relative; padding-top:0px; margin-bottom:10px;">
          &nbsp;
          <noscript>JavaScript is not enabled and is required for this form. First enable it in your web browser settings.</noscript>
        </div>
        <%= f.submit "Subscribe", type: :image, src: "/img/promo/Subscribe Button.png", id: "ebay_subscribe_button" %>
        <%= link_to "Skip", next_wizard_path %>
        <%= image_tag "/img/promo/Secure Server icon.png", id: "secure_server_image" %>
      <% end %>

    </div>
    <h3><%= image_tag "/img/promo/PayPal.png" %></h3>
    <div id="paypaldiv">
      <p>PayPal Here!</p>
    </div>
  </div>

所以我为Accordion保留了以下格式：

<div id="accordion">
  <h3>Header1</h3>
  <div>
    ...
  </div>
  <h3>Header1</h3>
  <div>
    ...
  </div>
</div>

到目前为止，我的假设是我做错了Coffeescript，或者我错过了某种支持JS或CSS。

Answer 1

我的Coffeescript错了。我应该传递一个函数，所以我不应该使用->运算符。传入散列非常有效：

$('#paymentdiv').accordion
  collapsible: true
  active: false
  icons: false
  heightStyle: 'content'
  animate: 300

jQuery Accordion不尊重设置

1 个答案: