Déterminer les Pixels de Longueur de Chaîne de caractères en Javascript/jQuery?

Question

Est-il possible de déterminer la longueur de pixel d'une chaîne en jQuery/JavaScript?

Answer 1

// Create a dummy canvas (render invisible with css)
var c=document.createElement('canvas');
// Get the context of the dummy canvas
var ctx=c.getContext('2d');
// Set the context.font to the font that you are using
ctx.font = fontsize + 'px' + fontname;
// Measure the string 
var length = ctx.measureText(the_text_that_you_want_to_measure);

Answer 2

placer du texte dans une div ou span et utiliser jquery largeur

Answer 3

Je ne crois pas que vous pouvez juste faire une chaîne de caractères, mais si vous mettez la chaîne à l'intérieur d'un <span> avec les bons attributs (taille, police de caractères, de poids, etc); vous devriez alors être en mesure d'utiliser jQuery pour obtenir la largeur de la travée.

<span id='string_span' style='font-weight: bold; font-size: 12'>Here is my string</span>
<script>
  $('#string_span').width();
</script>

Answer 4

Mettre dans un positionnement absolu div ensuite utiliser clientWidth pour obtenir la largeur d'affichage de la balise. Vous pouvez même définir la visibilité à "hidden" pour cacher la div:

<div id="text" style="position:absolute;visibility:hidden" >This is some text</div>
<input type="button" onclick="getWidth()" value="Go" />
<script type="text/javascript" >
    function getWidth() {
        var width = document.getElementById("text").clientWidth;
        alert(" Width :"+  width);
    }
</script>