javascript - 选择某个项目时更改下拉菜单的文本

Question

根据下拉列表的选择，Rails 应用程序中的文本必须更改。我浏览了 How to change the main display of dropdown when an item is selected in 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 属性。