J'ai un problème intéressant. J'ai un bouton utilisé pour sélectionner (comme un élément de sélection). Ce code est ici: puis il utilise des jQuery pour modifier le texte dans le bouton / sélectionnez comme suit: p> function dropdownButtonText(text) {
$("#dropdown_button").text(text);
}
4 Réponses :
Vous pouvez essayer de saisir la largeur des éléments avant le changement de texte: puis appliquez cette largeur dans la nouvelle fonction. P> function dropdownButtonText(text, width) {
$("#dropdown_button").css("width", width).text(text);
}
Si vous utilisez jQuery, vous pouvez utiliser OUTERWIDITH (édité ci-dessus).
Qui semble obtenir l'onduleur extérieur des mots, pas le bouton
Ensuite, vous devez obtenir la largeur du bouton. Changer var width = $ (ceci) .OrterWidth (); à var width = $ ("# dropdown_button"). Outerwidth ();
C'est parce que la largeur du bouton change lorsque le texte a moins de caractères que le précédent. Vous pouvez donner à la touche une largeur spécifique dans CSS afin qu'il ne change pas lorsque le texte change lorsque le texte change.
#dropdown_button {
min-width: 100px; // this is an example
}
Essayez ceci dans votre fichier CSS
.btn-primary {
min-width: 500px;
}
Cela modifie la bascule sur la charge, mais ne fait rien après que cela a été changé.
mon frère, j'ai édité ma réponse. juste essayer cela et me dire que cela a fonctionné
ci-dessous ce que j'ai essayé.
<div class="dropdown">
<button id="btnTest" class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown" style="width: 80%;">Dropdown Example
<span class="caret"></span></button>
<ul id="demolist" class="dropdown-menu">
<li><a href="#">HTML</a></li>
<li><a href="#">CSS</a></li>
<li><a href="#">JavaScript</a></li>
</ul>
</div>
</div>
<script type="text/javascript">
$('#btnTest').click(function() {
console.log("Test");
});
$('#demolist li').on('click', function(){
var selectedText = $(this).text();
console.log(selectedText);
$("#btnTest").html(selectedText+' <span class="caret"></span></button>');
});
</script>
Pouvez-vous faire un extrait pour démontrer le problème? Changer le texte ne changera pas la largeur Sauf si Le texte d'origine était plus large que la largeur autorisée et il a forcé l'élément à se développer pour s'adapter (en fonction des autres propriétés CSS).
@ Freedomn-m j'ai ajouté un lien vers un exemple de page afin que vous puissiez le voir.
a) Les sites externes ne sont pas utilisées pour des raisons historiques b) Je n'ai aucune idée de cette page qui cause le problème
Je viens d'ajouter deux coups d'écran pour que vous puissiez voir
Il n'y a pas de classe Dropdown_anchor dans votre code