2

当我单击其中一个字段时,下拉菜单正在关闭。我必须重新打开它,然后我才能输入,直到单击下一个字段。即使关闭下拉菜单,这些值也会保留。我怎样才能让它保持打开状态?

html.erb

<ul class="nav secondary-nav">      
  <li><%= link_to image_tag('icons/lock_icon.png') + " Log In" +('<span class="caret"></span>').html_safe , '#', { :class => 'dropdown-toggle', 'data-toggle' => 'dropdown' } %>

    <ul id="dropdown-login" class="dropdown-menu" style="padding: 10px 10px 0px 10px; width: 240px;">

      <%= form_for(resource, :as => resource_name, :url => session_path(resource_name)) do |f| %>

        <li> 
          <div>
            <%= f.label :email %><br />
            <%= f.email_field :email %>
           </div>
        </li> 

        <li>
          <div>
            <%= f.label :password %><br />
            <%= f.password_field :password %>
          </div>
        </li>

        <li> 
          <% if devise_mapping.rememberable? -%>

            <div>
              <%= f.check_box :remember_me %> <%= f.label :remember_me %>
            </div>
          <% end -%>
        </li> 

        <li>
          <div><%= f.submit "Sign in" %></div>
        </li>

      <% end %>
    </ul>
  </li>
</ul>

我使用 javascripts 但不起作用,例如 1。

  <script type="text/javascript">
        $('#dropdown-login input, #dropdown-login label').click(function(e) {
            e.stopPropagation();
        });
  </script>

2.

 <script type="text/javascript">
    $('.dropdown-menu').find('form').click(function (e) {
        e.stopPropagation();
    });
 </script>

3.

<script type="text/javascript">
  $('body')
    .off('click.dropdown touchstart.dropdown.data-api', '.dropdown')
    .on('click.dropdown touchstart.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() });
</script>

并在 application.js

//= require jquery
//= require jquery_ujs
//= require dataTables/jquery.dataTables
//= require dataTables/jquery.dataTables.bootstrap
//= require redactor-rails
//= require_tree .
//= require bootstrap-alert
//= require bootstrap-dropdown

谁能帮我解决我的问题?

更新 - 已解决

4

1 回答 1

2

将 class="dropdown" 添加到第一个 li 中,例如

<li class="dropdown"><%= link_to image_tag('icons/lock_icon.png') + " Log In" +('<span class="caret"></span>').html_safe , '#', { :class => 'dropdown-toggle', 'data-toggle' => 'dropdown' } %>

并添加javascript ..

 <script type="text/javascript">
    $('.dropdown-menu input, .dropdown-menu label').click(function(e) {
        e.stopPropagation();
    });
</script>
于 2012-12-12T06:27:13.477 回答