子字符串截斷文本？

我試圖找出如何截斷第一段，我已經試過：子字符串截斷文本？

$div.children(('p:eq(0)').substring(0,100)); 
$div.children(('p:eq(0)'.substring(0,100)));

但無論工作過......

下面是完整代碼（在這裏它有人幫我！用）

$j('#hp-featured-item > div[id^="post-"]').each(function() { 
     var $div = $j(this), 
       $h2 = $div.find('h2:first'), 
       $obj = $div.find('object, embed, img').filter(':first'), 
       id = this.id.match(/^post-([0-9]+)$/); 

     if($obj.size() > 0){ 
       // Find parent 
       var $par = $obj.closest('p'); 


       // Move to top of div 
       $obj.prependTo($div); 

       // Remove the now empty parent 
       $par.remove(); 

       if($obj.is('img')){ 
         // You can't wrap objects and embeds with links, so make sure we just wrap images 
         $obj.wrap($j('<a></a>').attr('href', '/blog/?p='+id[1])); 
       } 
     } 

     // Wrap the contents of the h2, not the h2 itself, with a link 
     $h2.wrapInner($j('<a></a>').attr('href', '/blog/?p='+id[1])); 
     $div.children(('p:eq(0)').substring(0,100)); 
     $div.children('p:gt(0)').remove(); 

});

來源

2009-11-17 n00b0101

這應該工作：

$fC = $div.children("p:first-child"); 
$fC.html($fC.html().substring(0, 100));

測試：它爲我工作。我的實體模型代碼：http://pastebin.com/f737f7ce9

<!DOCTYPE html> 
<html> 
<head> 
<title></title> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script> 
</head> 
<body> 

<div> 
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p> 
<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).</p> 
</div> 

<div> 
<p>Integer ut sapien vitae orci vehicula mattis at eget lacus. Duis enim purus, sagittis nec euismod vitae, laoreet sit amet augue. Sed lacus risus, congue ac cursus et, consectetur at erat. Vestibulum lobortis tincidunt risus, in malesuada lacus ultrices et. Nulla commodo lectus pharetra purus pulvinar auctor. Duis urna felis, consequat ac facilisis id, ultrices ac tellus. Aliquam id semper dolor. Aenean eu augue augue. Vestibulum a elit turpis. Sed sed dignissim augue. Maecenas malesuada aliquet mi, sit amet facilisis quam posuere ut. Nulla luctus nulla vitae est vehicula mattis. Sed in nisi ac urna egestas condimentum. Nulla facilisi. Proin sit amet justo purus. </p> 
<p>Vestibulum ut elit neque, eget blandit nulla. Mauris tortor nulla, tincidunt gravida placerat vel, iaculis nec ipsum. Donec sed quam massa, at dignissim arcu. Sed porta mattis elementum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In hac habitasse platea dictumst. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Curabitur vel turpis eget urna eleifend egestas sit amet ut nibh. Integer vitae varius neque. Nullam leo libero, condimentum in mollis ut, ornare et nulla. Etiam at quam quis sapien rutrum porttitor. Ut pellentesque mi vitae odio pellentesque sagittis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus a sapien nulla, a ultricies nibh. Curabitur lectus quam, rhoncus quis elementum a, congue auctor sem. </p> 
</div> 

<script type="text/javascript">//<!-- 

$(window).ready(function(){ 

$("div").each(function(){ 
var $div = $(this); 
var $fC = $div.children("p:first-child"); 
$fC.html($fC.html().substring(0,100)); 
}); 

}); 

// --></script> 

</body> 
</html>

來源

2009-11-17 01:59:49 mauris

我在這裏上傳了這段代碼（你甚至可以試試它）：http://jsfiddle.net/Sk8erPeter/2NRFE/。我還在被截斷的文本上附加'[...]「。 – Sk8erPeter 2011-12-27 21:17:10

$div.children(('p:eq(0)').substring(0,100));

看看該行。它採用「p：eq（0）」的前100個字符並將其用作孩子的選擇器。前100個字符就是它自己，所以沒有任何問題。 thephpdeveloper是對的，你想要innerHTML。除了，如果段落有HTML作爲內容，你不想分割標籤。因此改爲使用text。

var truncatedText = $div.children('p').eq(0).text().substring(0, 100); 
$div.empty().append(jQuery("<div/>").text(truncatedText));

此外，爲什麼所有變量都以$開頭？這通常保留給重要的系統級變量。

來源

2009-11-17 05:51:22 jpsimons

由於我真的很感謝這篇文章和巨大的幫助，我正在分享一個很酷的修改，我剛剛做了。

如果少於10個字符並且有條件地有一個「工具提示」的工作，這段代碼將防止追加。

<!DOCTYPE html> 
<html> 
<head> 
<title></title> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" 
     type="text/javascript"></script> 
<script type="text/javascript">// 
$(window).ready(function(){ 
    $("div").each(function(){ 
     $("#div2").hide(); 

     var $div = $(this); 
     var $fC = $div.children("p:first-child"); 

     //show hide functions in vars 
     var fn1 = function(){ $('#div2').show();}; 
     var fn2 = function(){ $('#div2').hide();}; 

     $("#div2").hide(); 

     ///conditional 
     if ($fC.text().length > 10) 
     { 
      $fC.html($fC.html().substring(0,14)); 

      ($fC).append("[...]"); 
      //show hide 
      ($fC).mouseover(fn1).mouseout(fn2); 
     } 
    }); 
}); 
</script> 
</head> 
<body> 

<div> 
<p>first really long line</p> 
<p>UNTOUCHED 2nd child</p> 
</div> 

<div> 
<p>1111 </p> 
<p>UNTOUCHED 2nd child</p> 

</div> 

<div id="div2">full text in tooltip content here will probably be 
an ajax call or something</div> 

</body> 
</html>

來源

2012-03-23 20:17:19 namretiolnave

子字符串截斷文本？

回答

相關問題