Botón Twitter Bootstrap js no funciona

Question

Estoy usando Twitter Bootstrap y parece que no puedo obtener los estados de los botones para cambiar.

Estoy copiando el js de http://jsfiddle.net/YCst4/1/ y no estoy obteniendo una respuesta. Es como si no hubiera cargado jQuery, pero tengo bootstrap.min.js cargado en mi encabezado. No tengo ningún problema con otros javascript en la página.

Esto es lo que tengo en mi opinión CodeIgniter:

<script> 
$('#button').button(); 

$('#button').click(function() { 
    $(this).button('loading'); 
}); 
</script> 

<button class="btn" id="button" type="button" data-text-loading="Loading...">Press Me</button> 

¿Alguna idea sobre lo que está causando esto? ¿bootstrap-button.js no forma parte de bootstrap.min.js que viene con Bootstrap?

http://twitter.github.com/bootstrap/javascript.html#buttons

EDIT:

Cuando veo-fuente de la página, puedo ver los bootstrap.min.js cargados en la vista de cabecera y, puedo hacer clic en él para ver su fuente, por lo el camino es correcto Sin embargo, el código del botón js solo funciona cuando repito <script src="http://site.dev/assets/admin/js/bootstrap.min.js"></script> en la propia vista de contenido.

Tengo jQuery cargó una línea por encima de bootstrap.min.js y los elementos jQuery en la misma vista que el botón funcionan perfectamente. Estoy perplejo.

Answer 1

Tenía jquery-ui-1.8.21.custom.min.js cargando después de bootstrap.min.js. Aparentemente hay un conflicto

Answer 2

Está intentando vincular un clic al botón antes de que el botón forme parte del DOM. Coloque sus cosas en la función de listo para documentos y debería estar bien.

Answer 3

Necesita poner el código en una función lista para documentos para que se ejecute después de que la página esté lista, no antes.

$(document).ready(function(){ 
    $('#button').button(); 

    $('#button').click(function() { 
    $(this).button('loading'); 
    }); 
}); 

JS Fiddle parece hacer esto automáticamente para usted, por lo que funciona allí.

Answer 4

Tuve el mismo problema recientemente. Aquí hay algunas cosas que pueden ayudarlo:

1. ¿Está cargando sus archivos js en el orden necesario? El orden de la lista (como etiquetas de script) debe estar en el orden correcto (basada en la dependencia), así:

   <script src="jquery.js"></script> 
   <script src="bootstrap.js"></script> 
   <script src="button_app.js."></script> 
   

2. ¿Está utilizando archivos locales o remotos css/js? Si está usando los remotos. Verifique si alguno de ellos hace referencia a github. Si se ven así:

   <script src="https://raw.github.com/twitter/bootstrap/master/js/bootstrap-alert.js"></script> 
   

   no funcionarán. Chrome lanzará un error tipo mime.

Answer 5

Para javascript novatos como yo: también tiene que cargar jQuery antes se define $('#button').click()