Question

<p class="pra">

SimpleText是OS X之前版本中Apple Macintosh OS的本机文本编辑器.SimpleText允许编辑包括文本格式（下划线，斜体，粗体SimpleText是OS X之前版本中Apple Macintosh OS的本机文本编辑器.SimpleText允许编辑包括文本格式（下划线，斜体，粗体）SimpleText是OS X之前版本中Apple Macintosh OS的本机文本编辑器.SimpleText允许编辑包括文本格式（下划线，斜体，粗体SimpleText是Apple Macintosh的本机文本编辑器OS X之前的版本中的操作系统.SimpleText允许编辑包括文本格式（下划线，斜体，粗体）

<script>
$(document).ready(function() {
if($('.pra').text().length >= 100) {
var txt= $('.pra').text();
var res =txt.slice(1,105);
//alert( res);
$('.pra').html(res+'.....'+'...<a class="readmore" href="#">&emsp;Read More</a>');
}
$('.readmore').on('click',function(){
$(this).parent('p.pra').html(txt+'.....'+'...<a class="readless" href="#">&emsp;Read Less</a>');
$('.readless').on('click',function(){
if($('.pra').text().length >= 100) {
var txt= $('.pra').text();
var res =txt.slice(1,105);
//alert( res);
$('.pra').html(res+'.....'+'...<a class="readmore" href="#">&emsp;Read More</a>');  
}
});
});
});
</script>

当我点击阅读更多oppening完整内容如果按Read Less它显示更少的内容直到这没问题但是再次第二次我点击阅读更多没有动作，没有更多的内容没有显示 Demo Link

Answer 1

而不是：

$('.readmore').on('click',function(){...});

尝试：

$('body').on('click','.readmore',function(){...});

与'.readless'

相同

同时使用txt.slice(1,105);

更改txt.slice(0,105);

或者您的文字每次都会丢失第一个字母

＆＃13;

 
$(document).ready(function() {
 
 //alert('fddf');
 if($('.pra').text().length >= 100) {

  var txt= $('.pra').text();
   var res =txt.slice(0,105);
   //alert( res);
   $('.pra').html(res+'.....'+'...<a class="readmore" href="#">&emsp;Read More</a>');
   
}

        $('body').on('click','.readmore',function(){
              $(this).parent('p.pra').html(txt+'.....'+'...<a class="readless" href="#">&emsp;Read Less</a>');


        $('body').on('click','.readless',function(){
         if($('.pra').text().length >= 100) {

  var txt= $('.pra').text();
   var res =txt.slice(0,105);
   //alert( res);
   $('.pra').html(res+'.....'+'...<a class="readmore" href="#">&emsp;Read More</a>');
   
}

        });

 });
 });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<p class="pra">
SimpleText is the native text editor for the Apple Macintosh OS in versions before OS X. SimpleText allows editing including text formatting (underline, italic, bold SimpleText is the native text editor for the Apple Macintosh OS in versions before OS X. SimpleText allows editing including text formatting (underline, italic, bold SimpleText is the native text editor for the Apple Macintosh OS in versions before OS X. SimpleText allows editing including text formatting (underline, italic, bold SimpleText is the native text editor for the Apple Macintosh OS in versions before OS X. SimpleText allows editing including text formatting (underline, italic, bold
</p>

＆＃13;

阅读更多并阅读更少的jquery问题

1 个答案: