我需要将<br />
添加到< p ="minimize"> < /p>
内的内容中当前即使字符串中有<br />
,在输出中所有字符串都显示在1行中而没有<br />
1}}。
以下代码似乎无法检测到<br />
。
jQuery(function(){
var minimized_elements = $('p.minimize');
minimized_elements.each(function(){
var t = $(this).text();
if(t.length < 100) return;
$(this).html(
t.slice(0,100)+'<span>... </span><a href="#" class="more">More</a>'+
'<span style="display:none;">'+ t.slice(100,t.length)+' <a href="#" class="less">Less</a></span>'
);
});
$('a.more', minimized_elements).click(function(event){
event.preventDefault();
$(this).hide().prev().hide();
$(this).next().show();
});
$('a.less', minimized_elements).click(function(event){
event.preventDefault();
$(this).parent().hide().prev().show().prev().show();
});
});
非常感谢您宝贵的意见和时间
答案 0 :(得分:1)
的变化: -
< p ="minimize">
需要<p class="minimize"> //remove space and add class
然后它会正常工作: -
实施例: -
jQuery(function(){
var minimized_elements = $('p.minimize');
minimized_elements.each(function(){
var t = $(this).text();
if(t.length < 100) return;
$(this).html(
t.slice(0,100)+'<span>... </span><a href="#" class="more">More</a>'+
'<span style="display:none;">'+ t.slice(100,t.length)+' <a href="#" class="less">Less</a></span>'
);
});
$('a.more', minimized_elements).click(function(event){
event.preventDefault();
$(this).hide().prev().hide();
$(this).next().show();
});
$('a.less', minimized_elements).click(function(event){
event.preventDefault();
$(this).parent().hide().prev().show().prev().show();
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
<p class="minimize"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eleifend risus sed feugiat faucibus. <br/> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eleifend risus sed feugiat faucibus.</p><br>
<p class="minimize"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eleifend risus sed feugiat faucibus. <br/> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eleifend risus sed feugiat faucibus.</p>