2011-11-04 61 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