欢迎来到Java学习网!
设为首页 | 加入收藏
当前位置: 首页 > Java语言 > jQuery教程 >

jQuery计算页面某段文字的长度的函数
核心函数,注意是基于JQuery。这个办法计算的值,无法大于页面宽度。

Javascript代码:

var stringWidth = function(fontSize, content) {
    var $span = $('<span></span>').hide().css('font-size', fontSize).text(content);
    var w = $span.appendTo('body').width();
    $span.remove();
    return w;
};

一个页面的完整例子,请打开控制台看结果:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>Document</title>
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>  
    <script>
        var stringWidth = function(fontSize, content) {
            var $span = $('<span></span>').hide().css('font-size', fontSize).text(content);
            var w = $span.appendTo('body').width();
            $span.remove();
            return w;
        };

        $(function(){
            if(console && console.log){
                console.log(stringWidth('12px', 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Mollitia, quos repellat maiores doloribus laborum natus quo laboriosam illum hic deleniti. Laborum, quisquam eaque sapiente quasi minus eveniet officiis vel perferendis!'));
            }
        });
    </script>
    <style type="text/css">
    </style>
</head>
<body>
</body>
</html>

    相关教程
    推荐内容