<style type="text/css">

text-overflow: ellipsis;

-o-text-overflow: ellipsis;

overflow: hidden;

white-space: nowrap;

width; 300px;

height: 30px;

display: block;

</style>

<script>

$(function () {
    $(".two-lines").each(function () {
        var $this = $(this);
        var _width = $this.css("width"), width = parseInt(_width.substring(0, _width.length - 2)); //顯示框的長度
        var _text = $this.text();
        var tot = 0.0, str = _text, add = $this.css("font-size"), num = parseInt(add.substring(0, add.length - 2)); //字或字母的長度
        var _char; 
        num += $this.css("font-weight") == "bold" ? 1 : 0;


        for (var i = 0; i < _text.length; ++i) {
            _char = _text.charCodeAt(i);
            if (_char >= 0 && _char <= 128) tot += num / 2;
            else tot += num;
            console.log("tot: " + tot);
            if (tot >= width) {
                str = _text.substring(0, i) + "<br />" + _text.substring(i);
                break;
            }
        }


        $this.html("<nobr>" + str + "</nobr>");
        console.log("width: " + width);
    })
})

</script>

<span class="two-lines"></span>