.each () функция jQuery не работает с новыми данными ajax - PullRequest
1 голос
/ 04 ноября 2011

Таким образом, все работает отлично, пока не будет выполнен вызов ajax и не будет вызвана функция для запуска вновь обновленного текста. Я понимаю, что это потому, что это .each (), а не .live (), но я не уверен, как заставить функцию работать с недавно обновленным текстом из ajax.

HTML & CSS:

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

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

<div class="ellipsis" style="width: 100px; border: 1px solid black;">Lorem ipsum dolor sit amet, consectetur adipisicing elit</div>
<div class="ellipsis multiline" style="width: 100px; height: 40px; border: 1px solid black; margin-bottom: 100px">Lorem ipsum dolor sit amet, consectetur adipisicing elit</div>

<script type="text/javascript" src="/js/jquery.ellipsis.js"></script>
<script type="text/javascript">
$(".ellipsis").ellipsis();
</script>

jquery.ellipsis.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);

Это прекрасно работает с текстом, однако, как только текст в div многоточия обновляется до чего-либо еще от обратного вызова ajax success, такого как «Привет, я новый текст в этом div и должен быть обрезан», это не работает. Я хочу, чтобы он применялся только к только что обновленному тексту из колбэка успеха .

Вот что я пробовал до сих пор:

success: function(data) {
     $(".ellipsis").text(data);
     $(".ellipsis", data).ellipsis(); // not working
     }

Вот скрипка без аякса http://jsfiddle.net/TF6Rb/625/

Есть идеи?

1 Ответ

2 голосов
/ 04 ноября 2011

Просто сделай $(".ellipsis").ellipsis(); Я должен нормально работать.

...