jQuery / Twitter Bouton de chargement du texte de chargement de données avec délai

Question

jQuery / Twitter Bouton de chargement du texte de chargement de données avec délai

Demandé el 25 de Août, 2012: Quand la question a-t-elle été
33075 affichage: Nombre de visites la question a
5 Réponses: Nombre de réponses aux questions
Résolu: Situation réelle de la question

Je vais essayer d'obtenir cet exemple précis de travail sur mon site:

http://getbootstrap.com/2.3.2/javascript.html#buttons

Cependant, incluant simplement ce code HTML:

<button type="button" class="btn btn-primary" data-loading-text="Loading...">Loading state</button>

Ne fonctionne pas. Je suis en cours d'exécution jQuery 1.7.x et ont chargé le Bootstrap, fichiers JS.

Pour être précis: je veux que le bouton pour passer à la "chargement" changement de texte pour un léger retard, puis revenir en arrière pour le texte normal. Il ne semble pas être un bon exemple disponible en ligne à partir de mes recherches sur Google (la plupart sont demander un permanent de modification de l'état ou de la bascule), et le fichier de Bootstrap site lui-même est manquant dans la documentation ici.

Demandé el 25 de Août, 2012 par Kyle

Answer 1

5 Réponses

Answer 2

103voto

msc Points 2448

Dans la page de documentation, un fichier en cours de chargement appelé application.js est en cours de chargement. http://twitter.github.com/bootstrap/assets/js/application.js

 // button state demo
$('#fat-btn')
    .click(function () {
        var btn = $(this)
        btn.button('loading')
        setTimeout(function () {
            btn.button('reset')
        }, 3000)
    });

Répondu el 25 de Août, 2012 par msc (2448 Points )

Answer 3

21voto

Geoff Wells Points 161

Ou simplement ajoutez ceci pour qu'il récupère l'attribut Twitter Bootstrap.

 $('button[data-loading-text]').click(function () {
    $(this).button('loading');
});

Répondu el 19 de Juin, 2013 par Geoff Wells (161 Points )

Answer 4

6voto

user1837332 Points 51

Notez comment la réponse acceptée a converti l'objet bouton jQuery en une variable js avant d'exécuter le bouton ('chargement') dessus, car, tant que cela fonctionne, le bouton ('chargement') ne fonctionnera pas s'il est utilisé directement sur l'objet bouton jQuery. .

Répondu el 20 de Novembre, 2012 par user1837332 (51 Points )

Answer 5

2voto

Diego Torres Points 1

il suffit d'inclure la bibliothèque de démarrage:

 <script src="http://twitter.github.com/bootstrap/assets/js/bootstrap.js "></script>

Ceci est un exemple:

 <!DOCTYPE html>
<HTML>
<HEAD>
    <TITLE>Bootstrap Example</TITLE>
    <link type="text/css" rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css ">
<STYLE>
</STYLE>
</HEAD>
<BODY>
    <button type="button" class="btn btn-primary" id="btnD" data-loading-text="=)">hola!!!</button>


    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="http://twitter.github.com/bootstrap/assets/js/bootstrap.js "></script>
    <script type="text/javascript">
        $(function(){
            $('#btnD').click(function(){
                  var btn = $(this); 
                  btn.button('loading');
            });
        });
    </script>
</BODY>
</HTML>

Répondu el 25 de Juillet, 2013 par Diego Torres (1 Points )

Answer 6

1voto

dsd Points 1

De plus, jquery a la méthode .delay () qui peut être plus facile à utiliser que setTimeout.

Répondu el 19 de Septembre, 2012 par dsd (1 Points )

jQuery / Twitter Bouton de chargement du texte de chargement de données avec délai

Réponses

Questions en vedette

Top Tags

Prograide.com

Powered by:

jQuery / Twitter Bouton de chargement du texte de chargement de données avec délai

Réponses

Questions en vedette

Top Tags

Dans notre réseau

Prograide.com

Powered by: