twitter bootstrap drop down improvvisamente non funziona

Mi stavo chiedendo se qualcuno potesse aiutarmi. il menu a discesa del bootstrap ha smesso improvvisamente di funzionare. Non ho idea del perché. stava funzionando prima. non ho toccato il mio punto di vista i miei layout, quindi penso che il problema non ci sia. sono abbastanza sicuro che abbia a che fare con il mio javascript ma non so da dove viene.

il mio file gem è …

gem 'rails', '3.2.3' gem 'bootstrap-sass', '2.0.1' gem 'bcrypt-ruby', '3.0.1' gem 'faker', '1.0.1' gem 'will_paginate', '3.0.3' gem 'bootstrap-will_paginate', '0.0.5' gem 'devise' gem 'carrierwave' gem 'rmagick' gem 'delayed_job_active_record' gem 'daemons' gem 'make_voteable' gem 'admin_data' gem 'indextank' 

e il mio application.js è …

 //= require jquery //= require jquery-ui //= require jquery_ujs //= require bootstrap-dropdown //= require bootstrap //= require_tree . 

immagino che forse ha a che fare con i miei file di configurazione in qualche modo?

dovevo muovermi

 //= require jquery 

sotto

 //= require bootstrap 

entro

 application.js 

se le attività di precompilazione non funzionano, provare anche a rimuovere le risorse precompilate

rake assets:clean

Ho trovato che il dropdown js che viene caricato due volte nella pipeline degli asset sembra aprire e chiudere immediatamente il menu a discesa, ma funzionerebbe bene in Heroku / Production.

Ho avuto lo stesso problema e ho trovato 2 modi per risolverlo.

Per prima cosa, lascia che ti dica la mia configurazione: ho seguito le istruzioni sul sito di bootstrap e scaricato bootstrap-dropdown.js. Lo metto in risorse / javascript. Il mio file application.js ha il seguente aspetto:

 //= require jquery //= require jquery_ujs //= require twitter/bootstrap //= require_tree . 

Gli elenchi a discesa non hanno funzionato.

Ho notato nel sorgente della pagina che un tag script per bootstrap-dropdown.js è apparso due volte: (Ho rimosso la roba irrilevante per brevità)

  

Così ho rimosso la riga //= require_tree . da application.js, riavviato il server e il dropdown ha funzionato!

Poi ho rimesso la riga //= require_tree . e invece ha rimosso il file assets / bootstrap-dropdown.js, e di nuovo ha funzionato!

Non lo capisco, ma riordinare // = richiede jquery e // = require bootstrap sembra aver risolto il problema due volte per me. Primo avvio del bootstrap sopra jquery come suggerito da Sasha. Poi ho fatto più lavoro e preparato per la distribuzione usando jruby su rails 3.2.3. Le risorse precompilate, i warble ei dropdown cessano di funzionare sia nello sviluppo che nella produzione. Elimina pubblico / risorse, così come alcuni file e file .class in tmp. Nessun effetto. Alla fine ho spostato l’ordine in application.js di nuovo a quello che era stato prima dell’ultimo episodio di errore, cioè jquery prima del bootstrap, e gli elenchi a discesa funzionano di nuovo.

È ansible che una modifica a application.js stia innescando una ricostruzione di qualche cache o qualche processo dietro le quinte che è la fonte del problema? La prossima volta che succederà, proverò ad apportare una piccola modifica a application.js e vedere se questo fa qualcosa.

Lo stavo sperimentando sulla mia macchina di sviluppo ma il mio server di produzione funzionava bene. Ho notato che mentre il riordino di js richiede nel file application.js di risolvere il problema in fase di sviluppo (i dropdown funzionano di nuovo), fai attenzione perché questo ha ucciso i miei dropdown nella produzione. Dovevo tornare indietro e rimetterli nel modo in cui avrebbero dovuto riprendere la produzione. Per ora li sto solo temporaneamente cambiando in dev quando ne ho bisogno.

Precompilare nuovamente le risorse ha risolto il problema per me

Anch’io ho avuto questo problema … ed era legato ai turbolinks delle rotaie. Nella pagina iniziale caricare i menu a discesa non funzionava, ma dopo un aggiornamento lo avrebbero fatto. E questo perché con i link turbo alcuni elementi Dom potrebbero non essere caricati / ricaricati ogni volta. Quindi, il mio drop down ha smesso di funzionare in modo coerente (tra le altre cose). La correzione di rails 4 per questo è di aggiungere la gem jquery.turbolinks https://github.com/kossnocorp/jquery.turbolinks . Una cosa con questa gem che ho trovato (e più tardi mi sono imbattuto in alcuni blog) è che il tag javascript deve essere all’interno della testa. Il README non menziona questo … ma

Ho trovato un’alternativa! tutte queste soluzioni non hanno funzionato per me. Invece di fare in modo che il menu a discesa venga triggersto al clic, ho triggersto il trigger al passaggio del mouse. inserire la parte inferiore della pagina nei tag di script. codice da: http://codedecoder.wordpress.com/2013/10/21/bootstrap-drop-down-menu-not-working-rails/

 $(document).ready(function(){ $('.navbar .dropdown').hover(function() { $(this).find('.dropdown-menu').first().stop(true, true).delay(250).slideDown(); }, function() { $(this).find('.dropdown-menu').first().stop(true, true).delay(100).slideUp() }); n}) 

Vedi Rails 3.1 Assets – Strange Serving in Development

c’è un bug in cui la versione compressa viene inclusa in modalità debug in application.js

Le risorse di precompilazione non hanno funzionato. Inserimento dell’elenco a discesa prima che jquery funzionasse nello sviluppo ma non in produzione L’opzione di rimozione dell’elenco a discesa funzionava ancora in fase di sviluppo: -O

Mettere l’ordine giusto e rimuovere tutto nella cartella public / assets ha funzionato nello sviluppo.

Il ticket n. 5145 è stato chiuso di recente per questo. La correzione è stata ripristinata, ma alla fine è stata fornita una soluzione specifica per l’applicazione e funziona per me. Assicurati di svuotare anche la cache del browser.

Spostamento //= require jquery sotto //= require bootstrap e l’aggiornamento gem 'bootstrap-sass' , in 2.3.0.1 , risolto il mio problema.

Voglio aggiungere quella soluzione che ho menzionato sopra funziona solo su Localhost ma non su Heroku. La soluzione per entrambi nel mio caso era:

//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require_tree .

gem bootstrap-sass , 2.3.0.1

e <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %> deve essere all’interno di ” _header.html.erb ” ed eliminare da ” application.html.erb “.

Ho avuto questo errore e il mio CSS stava impedendo il funzionamento del menu a discesa.

Nello specifico ho avuto “overflow: hidden;” nel mio header nav CSS. Rimozione che ha risolto il problema.

Assicurati inoltre di non avere //require bootstrap-sprockets all’interno di application.js. Ho commentato questo e ha funzionato per me.