2014-01-17 17 views
2

我想把一個字符串的可見長度減少到約25個字符。我想保留整個字符串在頁面上。當然隱藏。是否可以對字符串進行子串處理,但保留整個字符串?

<span>This message is 34 characters long</span> 

$("span").text(function(index, text) { 
    return text.substr(0, 25); 
}); 

將返回

This message is 34 charac 

,我想它來寫此消息是34 CHARAC但保持隱藏在人物的休息,所以我可以將它們在以後使用.show顯示()或別的東西。

+0

您可以將屬性或屬性設置爲原始文本並稍後使用該屬性對其進行恢復。 – dandavis

+1

或使用css:white-space:pre;寬度:25em;溢出:隱藏;顯示:inline-block; – dandavis

+0

@dandavis字體大小不是字母寬度:http://jsfiddle.net/V2h2F/ :) 好吧,每個字母的一半,你在! http://jsfiddle.net/BnSzE/;)你也可以做'ellipsis'的東西。 – loveNoHate

回答

3

在商店它jQuery的data()

$("span").text(function(index, text) { 
    $(this).data('txt', text); 
    return text.substr(0, 25); 
}); 

後來你可以做

$("span").text(function() { 
    return $(this).data('txt'); 
}); 
+0

給這個男人一個餅乾。最好的答案和它的作品完美! – MortenMoulder

+1

@Snorlax - 謝謝!作爲我自己的核電廠的所有者,我並不真的需要餅乾,史密瑟斯爲我買了這些,但接受答案肯定會很好? – adeneo

+0

Lmao。在那裏笑,接受一次我可以(我相信兩分鐘)編輯:一分鐘! – MortenMoulder

1

您可以將整個字符串寫入它自己的html元素,它具有display:none樣式。您也可以將數據屬性添加到span標籤。

+0

有同樣的想法 –

0
$("span").html(function(index, text) { 
    return text.substr(0,25) + '<span style="display:none">' + text.substr(25) +'</span>'; 
}); 
0

字符串添加到數據屬性:

<span data-text="This message is 34 characters long"></span> 

$("span").text(function(index, text) { 
    return $(this).data('text').substr(0, 25); 
}); 

Demo

0

可以使用CSS屬性: 選擇您保存這樣

<div>My String</div> 
    <style> 
    div{ 
    width: 50px; 
    overflow: hidden;/* this will hide all the content that surpass the width */ 
    } 
    </style> 
0

字符串我會在一個隱藏的範圍包裹的不需要部分的股利,所以我可以在以後使用它.toggle()

$('span').html(function(index, oldHtml) { 
     return oldHtml.substring(0,25) + '<span class="toggleHidden">' + text.substr(25) + '</span>'; 
}); 

$('.toggleHidden').toggle(); 

注意使用.html()代替.text()作爲第一個讓我設置HTML元素的孩子。

相關問題