Bootstrap, de Twitter, est actuellement le cadre frontal le plus populaire. Bootstrap est basé sur HTML, CSS et JavaScript. Il est simple et flexible, ce qui rend le développement Web plus rapide.
La barre de progression fournie par le framework Bootstrap, comme le code du tutoriel Novices
<div> <div role = "Progressbar" aria-valuenow = "60" Aria-Valuemin = "0" aria-Valuemax = "100"> <span> 40% complet </span> </div> </div>
Permettez-moi, un vrai novice comme moi, je ne sais pas comment ... laissez-le devenir une véritable barre de progrès. Cependant, après être entré à Baidu à quelques reprises, vous ne pouvez y parvenir qu'en ajoutant du code jQuery pour coopérer. Mon diplôme est enfin réalisé comme suit, un peu heureux.
<div id = "mymodal1" tabindex = "- 1" role = "dialog" aria-labelledby = "mymodallabel" aria-hidden = "true" data-backdrop = "static"> <div> <div> <span style = "text-align: Center; Color: Red"> Le fichier est à télécharger, veuillez ne pas recadresser la page! </span> <br /> <div> <div> </div> </div> </div> </div> </div> </div> </div> </div> </div>
Le paragraphe ci-dessus consiste à utiliser la boîte contextuelle pour contenir la barre de progression. Sinon, comment puis-je réaliser quelque chose qui commence à se cacher? Lorsque vous utilisez Bootstrap comme barre de progrès ou en une boîte contextuelle fixe, l'ajout de données-BackDrop = "Static" est mieux, car sans cette modification, vous cliquez simplement sur la souris et la boîte contextuelle disparaîtra.
<scripts> var p = 101; var stop = 1; fonction run () {p + = 4; $ ("div [class = bar]"). css ("largeur", p + "%"); var timer = setTimeout ("run ()", 500); if (p> 100 && stop <1) {p = 0; }} $ ('# Btnsubmit'). Cliquez sur (fonction () {$ ('# myModal1'). Modal ('show'); p = 0; stop = 0; run (); $ ('# upload'). Soumed ();}); </cripts>En fait, la barre de progrès de Bootstrap est affichée via le style CSS, donc tant que vous continuez à modifier la valeur de la largeur du style, vous pouvez l'afficher. Bien sûr, dans mon cycle, la page d'actualisation ne peut être redécouverte et cachée. Si c'est le cas, soumettez-le avec Post, puis jugez en fonction de la valeur de retour, puis cachez-le avec $ ('# myModal1'). Modal ('Hide'); et modifiez la valeur correspondante de l'arrêt en 1, sinon il continuera de fonctionner.