javascript - 连省略号怎么排

如何制作每个缩略图，即使下一个缩略图也如此，等等。当文本/标题达到最大值后，文本/标题会变成省略号。行/列的宽度/高度。这是site，这是需要转换的代码。

    <script>
$(document).ready(function(){
    $("button").click(function(){
        $("body").append("<div id = 'data'><ul>jffnfjnkj</ul></div>");
        var dataContainer = $("#data ul");
        $.ajax({
            url:'http://gdata.youtube.com/feeds/api/users/sony/uploads?alt=jsonc&v=2&callback=?',
            dataType: "jsonp",
            timeout: 5000,
            success: function(data){

                     $.each(data.data.items,
                               function(i, val) {

                                 if (typeof(val.player) !== 'undefined' && typeof(val.title) !== 'undefined') {
                                    dataContainer.append('<div style="float:left;width:150px;height:150px;overflow:none;text-overflow:ellipsis"><a href='+val.player["default"]+' target="_blank">'+val.title+'</a><br /><img src="'+val.thumbnail.sqDefault+'" width="120" height="90" alt="'+val.title+'"/><br />Views '+val.viewCount+'</div>');
                                 }
                         });
                    }
                });
            });
});
</script>

最佳答案

当您尝试省略多行（在本例中为2）时，我发现text-overflow不起作用，并且仅适用于单行文本。

在这种情况下，我已经非常方便地使用DotDotDot jQuery plugin了。

在您的情况下，我看到您的多行都作为锚标记，因此您可以像这样将CSS的宽度和高度设置为可见区域。

a {width:150px; height:40px;}

并以JS作为一个非常基本的示例，它将是...

$("a").dotdotdot({ellipsis:'...'});

请参阅此基本工作fiddle。

抱歉，我找不到链接的JS文件，所以我不得不在小提琴中包括插件...实际的代码在底部。