2011-11-04 83 views
1

因此,一切都很完美,直到创建ajax调用并调用函数以在新更新的文本上运行。我知道这是因为它是一个.each()不是.live(),但我不知道如何使这个函数在来自ajax的新更新的文本上工作。.each()jQuery函数无法处理新的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成功回调更新为其他任何内容,例如“嗨,我是这个div中的新文本,应该修剪”,它不起作用。我希望它被应用于只有成功回调的新更新文本。

这是我到目前为止已经试过:

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

这里是没有AJAX http://jsfiddle.net/TF6Rb/625/

任何想法的小提琴?

回答

2

只要做到$(".ellipsis").ellipsis();我应该工作得很好。

+0

最近不知道我有什么问题!我通过在成功回调的最后一行中将数​​据放在省略号函数旁边来读取它,它只会影响新添加的文本,而不是在具有相同.ellipsis类的其他任何文件上运行,这就是我想要的。 $( “省略号”)省略号()。会再一次完成所有功能,而不仅仅是新添加的文本,对吧? – Maverick

+0

是的。如果这是你制作插件的方式 – Neal