选择一个项目时更改下拉菜单的文本

Question

根据下拉菜单的选择，文本必须在Rails应用程序中更改。我研究了如何在Bootstrap中选择项目时更改下拉菜单的主要显示方式，我添加了js并尝试集成到我的应用程序中，但是它不起作用。

 %hearder %nav.navbar.navbar-job .container{class: "text-center"} %div{class: "btn-group"} %ul.dropdown I am %a.btn.dropdown-toggle.btn-job{"data-toggle" => "dropdown","role" => "button"} Select %span{class: "caret",id: "dropdown_title"} %ul.dropdown-menu{id: "divNewNotifications"} %li= link_to "All Jobs", jobs_path - Jobcategory.all.each do |jobcategory| %li= link_to jobcategory.name, jobs_path(jobcategory: jobcategory.name) 

 $('.dropdown-toggle').dropdown(); $('#divNewNotifications li').on('click', function() { $('#dropdown_title').html($(this).find('a').html()); }); 

更新：

 %hearder %nav.navbar.navbar-job .container{class: "text-center"} %div{class: "btn-group"} %ul.dropdown %a.btn.dropdown-toggle.btn-job{"data-toggle" => "dropdown","role" => "button"} Select %span{class: "caret",id: "dropdown_title"} %ul.dropdown-menu{id: "divNewNotifications"} %li= link_to "All Creative Jobs", jobs_path - Jobcategory.all.each do |jobcategory| %li= link_to jobcategory.name, jobs_path(jobcategory: jobcategory.name) Designer %body %div{id:"testing"} = render 'testing' 

 dropdown.js $('#divNewNotifications li').on('click', function() { $('.dropdown-toggle').html($(this).find('a').html()); }); $(function(){ $("#divNewNotifications li").live('click', function(){ $.get(this.href,null,null,"script"); return false; }); }); 

 index.js.erb $("#testing").html("<%= escape_javascript(render("testing")) %>"); 

Answer 1

我想你想做这样的事情。

$('#divNewNotifications li').on('click', function() {
    $('.dropdown-toggle').html($(this).find('a').html());
});

http://www.bootply.com/9KeT6fk2PM

您不需要使用$('.dropdown-toggle').dropdown(); 因为在按钮上使用了data-toggle属性。