選擇一個項目時更改下拉菜單的文本

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屬性。