일반 div 텍스트를 짧게

Question

내 피드를 표시하는 'embedly'라는 서비스를 사용하고 있습니다. 나는이 피드의 텍스트를 단축하기 위해 노력하고있어, 그래서 시도 :

$('.description').html(
    function(){ 
     return $.trim($(this).html()) 
       .substring(0, 100) 
       .split(" ").slice(0, -1) 
       .join(" ") + "...";} 
); 

내가 문서 준비에서 이것을두고도 'window.load'하지만 아무것도 작동하는 것 같다. 다음은 예입니다. http://jsfiddle.net

Answer 1

이 하나는 알아 내기에 매우 오랜 시간이 걸렸지 만, 최선의 방법은 요소를 DOM에로드하고 함수를 실행하는 것입니다. http://jsfiddle.net/2VBSX/5/

$('div.newscontainer').embedly({ 
    key:':e0a98aba95ef11e09dcd4040d3dc5c07' 
}).hide(); 

setTimeout(function() { 
    $('div.newscontainer').show().find('.description').html(
     function(){ 
      return $.trim($(this).html()) 
      .substring(0, 100) 
      .split(" ").slice(0, -1) 
      .join(" ") + "..."; 
     } 
    ); 
}, 1000); 

Answer 2

Jquery의 HTML은 함수를 인수로 허용하지 않고 일반 HTML (문자열) 만 허용합니다. 당신이해야 할 wanto 무엇을 사용 는 수행 .each() :

수정 : 아래의 주석에 의해 지적, 내 코드는 올바르지 만 .html 중에서() 는는 참에, 인수로 함수를 허용 않습니다 양식 $(...).html(function(index, oldhtml));을 작성하여 html 부분에 직접 액세스 할 수 있습니다. (그것을 지적 @Raminson 덕분에)

이전에 내 코드이었다 @ Raminson의 관찰에 :

$(".description").html(function(i,s) { return reduce(s); }); 

:

$('.description').each(
    function(i,e){ 
     $(e).html(reduce($(e).html()));} 
); 

function reduce(s) 
{ 
     return s.substring(0, 100) 
       .split(" ").slice(0, -1) 
       .join(" ") + "..."; 
} 

보정으로, 첫 번째 부분은 (여전히 reduce() 기능을 사용)이된다

Answer 3

그렇기 때문에 OP에는 모든 요소가 즉시 작성되었다는 언급이 없으므로 다른 대답은 유효하지 않으므로 고전적인 방법으로는 일치시킬 수 없습니다.

수정 사항이 적절한 이벤트에 첨부 된 경우 (예 : 클릭) .on()의 대표는 DOM에 삽입 된 새 요소에 대해서도 유효하기 때문에 쉽게 사용할 수 있습니다. 그러나 이런 경우가 아니기 때문에 요소 작성시 작동해야합니다.

한 가지 해결책은 @ ChrisClower 's (타이머를 사용하여 새 요소를 정기적으로 폴링하는 것)입니다. http://docs.jquery.com/Plugins/livequery

그런 다음 모두가 간단 할 것 :

또 다른 해결책은 LiveQuery 플러그인을 사용하는 것입니다

$(".description").livequery(function() { $(e).html(reduce($(e).html())); }); 

function reduce(s) 
{ 
    return s.substring(0, 100) 
      .split(" ").slice(0, -1) 
      .join(" ") + "..."; 
}