El botón se introduce en el capítulo de botón Bootstrap. Con el complemento de botones, puede agregar algunas interacciones, como controlar el estado del botón o crear grupos de botones para otros componentes, como barras de herramientas.
Si desea hacer referencia a la funcionalidad del complemento por separado, debe hacer referencia a Button.js. O, como se menciona en el capítulo de descripción general del complemento Bootstrap, puede consultar bootstrap.js o versiones comprimidas de bootstrap.min.js.
1. Estado de carga
Para agregar el estado de carga al botón, simplemente agregue datos-carga-text = "Cargando ..." al elemento del botón como su atributo, como se muestra en el siguiente ejemplo:
<botón id = "fat-btn" data-carga-text = "carging ..." type = "botón"> estado de carga </boton> <script> $ (function () {$ (". btn"). click (function () {$ (this) .button ('carging'). demandado (1000). }); }); </script>2. Interruptor único
Para activar el interruptor de un solo botón (es decir, para cambiar el estado normal del botón al estado de presionar, y viceversa), simplemente agregue datos de datos = "botón" al elemento del botón como su atributo, como se muestra en el siguiente ejemplo:
Copie el código de la siguiente manera: <botón data-toggle = "botón" autocomplete = "Off"> Single Switch </boton>
Nota: Cuando la página de Firefox se carga varias veces, el botón puede mantener el formulario deshabilitado o seleccionado. La solución es: agregar autocomplete = "apagado".
3. Botones de radio
Del mismo modo, puede crear un grupo de botones de radio y agregar una palanca para el grupo de botones de radio agregando el atributo de datos de datos de datos = "botones" a BTN-Group.
<div data-toggle = "botones"> <etiqueta for = ""> <input type = "radio" name = "sex" autocomplete = "off" vers> masculino </label> <etiqueta for = ""> <input type = "radio" name = "sex" autocomplete = "Off"> femenino </label> </div "
4. Verifique el botón
Puede crear un grupo de casilla de verificación y agregar una alternancia al grupo de casilla de verificación agregando el atributo de datos de datos de datos = "botones" al grupo BTN.
<div data-toggle = "buttons"> <etiqueta for = ""> <input type = "checkbox" name = "fa" automyComplete = "Off" checked> Music </label> <etiqueta for = "> <input type =" checkBox "name =" fa "Autocomplette =" Off "> Sports> Sports </label> <Label>"> <input type = "checkBox" name = "fa" Autocomplety = "Sports </" Sports </sel etiqueta> <label para = ">" <input type = "checkBox" name = "fa" Autocomplety = "Sports </" Sports </sel etiqueta> <label para = ">" <input type = "checkBox" name = "fa" faU "Autocomplet Art </sello> <etiqueta for = ""> <input type = "checkbox" name = "fa" autocomplete = "Off"> Computer </label> </div>
Hay tres parámetros en el método del botón en el complemento del botón: alternar, reiniciar y una cadena (como la carga, completar).
// puede reemplazar data-toggle = "botón" $ ('botón'). On ('hacer clic', function () {$ (this) .button ('toggle');})Aquí hay algunos métodos útiles en los complementos de botones:
Lo anterior es todo el contenido de este artículo. Espero que sea útil para el aprendizaje de todos. Para obtener más información sobre Bootstrap, consulte el tema: Tutorial de aprendizaje de Bootstrap