Как применить многоточие jQuery к строке с данными jQuery

Question

Я хочу добавить многоточие (…) в конец строки данных (в этом столбце комментариев).Для этого я добавил JQuery многоточие JS.Как я должен указать высоту строки таблицы данных jQuery, чтобы он показывал только 2 строки.Сейчас высота регулируется в соответствии с длиной текста.

Это моя таблица jQuery

<div id="comments">
 <c:choose>
 <c:when test="${null ne comments and not empty comments}">
  <table id="dataTable2" cellpadding="0" cellspacing="0" border="0" class="display" style="width:100%;">
    <thead><tr><th>Id</th>
        <th width="15%">User</th> 
        <th width="15%">Role</th>       
        <th width="45%">Comment</th></tr></thead>
    <tbody>
        <c:forEach items="${comm}" var="comm" varStatus="status">
            <tr><td>${comment.commentId}</td>
            <td width="15%">${comm.userFullName}</td>
            <td width="15%">${comm.userRoleName}</td>
            <td width="45%" style="height:20px" class="ellipsis multiline">${comm.CommentAbbreviation}</td></tr>
        </c:forEach>
    </tbody>
  </table>
 </c:when></c:choose>
</div>

jquery.autoellipsis.js

(function($) {
$.fn.ellipsis = function()
{
    return this.each(function()
    {
    var el = $(this);

        if(el.css("overflow") == "hidden")
        {
        var text = el.html();
        var multiline = el.hasClass('multiline');
        var t = $(this.cloneNode(true))
                .hide()
                .css('position', 'absolute')
                .css('overflow', 'visible')
                .width(multiline ? el.width() : 'auto')
                .height(multiline ? 'auto' : el.height());

el.after(t);

function height() { return t.height() > el.height(); };
function width() { return t.width() > el.width(); };

var func = multiline ? height : width;

while (text.length > 0 && func())
{
        text = text.substr(0, text.length - 1);
        t.html(text + "...");
}

el.html(t.html());
t.remove();
            }
        });
};
})(jQuery);

класс css

.ellipsis {
        white-space: nowrap;
        overflow: hidden;
}

.ellipsis.multiline {
        white-space: normal;
}

Как установить высоту для строки с данными?

Answer 1

Это прекрасно сработало для меня

.dataTable th, .dataTable td {
max-width: 200px;
min-width: 70px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

Answer 2

Я нашел решение.Это не самый правильный путь, но он работает.Я завернул данные в элемент div и изменил следующую строку.

<td width="45%" style="height:20px" class="ellipsis multiline">${comm.CommentAbbreviation}</td>

Заменить на

<td width="45%"><div class="ellipsis multiline" style="height: 35px;">${comm.CommentAbbreviation}</div></td>

Answer 3

у меня работает

.td-limit {
    max-width: 70px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}