如何在按子字符串更改后获取旧文本

How to get old text after changing by substring?

本文关键字:获取 文本 字符串      更新时间:2024-03-25

这里我试图显示每个div文本。但如果div文本将大于190个单词,则使用read more链接只显示190个单词。单击read more链接时,我无法显示旧的全文。不知道如何存储相关的旧全文并以弹出样式重新显示。

<style type="text/css">
div{
  width: 50%;
  height: auto;
  background: #faaaaf;  
  border : 2px solid #aedd87;
  position: relative;  
}
.popup{
  position:absolute;top:20%;left:25%;border:1px solid red;background:#f39323;width:50%;height:50%;
}
.close{
  top: -5;
  left: 98%;
  width: 20px;
  height: 10%;
  background: brown;
  position: absolute;
}
</style>
<div>Accelerator beam data commissioning equipment and procedures:
Report of the TG-106 of the Therapy Physics Committee of the AAPM
Indra J. Dasa
Department of Radiation Oncology, University of Pennsylvania, Philadelphia, Pennsylvania 19104
Chee-Wai Cheng</div>
<div>Accelerator beam data commissioning equipment and procedures:
Report of the TG-106 of the Therapy Physics Committee of the AAPM
Indra J. Dasa
Department of Radiation Oncology, University of Pennsylvania, Philadelphia, Pennsylvania 19104
Chee-Wai Cheng
</div>
<div>Accelerator beam data commissioning equipment and procedures:
Report of the TG-106 of the Therapy Physics Committee of the AAPM
Indra J. Dasa
Department of Radiation Oncology, University of Pennsylvania, Philadelphia, Pennsylvania 19104
</div>

这是我通过jquery 尝试的

<script type="text/javascript">
  $('div').each(function(i){
    fulltext = $(this).text();
    if(fulltext.length > 190){      
     $(this).text(fulltext.substring(0,190)).append("<a href='#' class='read'>Read More</a>");
    }  
  });
  $('.read').click(function(){
    //stuck here getting old full text
     var popup = "<div class='popup'><span class='close'>X</span>"+$(this).parent().text()+"</div>";         $('body').append(popup);
  });
  $('body').on('click','.close',function(){
    $('.popup').remove();
  });
</script>

$('.read').click()中,我如何访问旧的全文并在弹出框中显示???

我认为代码中的问题是,在创建这些元素后,必须为.read元素分配click事件。

    $('div').each(function(i){
      var fulltext = $(this).text();
      if(fulltext.length > 190) { 
        $(this).text(fulltext.substring(0,190)).append("<a href='#' class='read'>Read More</a>");
      }
      $('.read').click(function(){
        //stuck here getting old full text
         var popup = "<div class='popup'><span class='close'>X</span>"+$(this).parent().text()+"</div>";         $('body').append(popup);
  });
    });

看看这个代码:

小提琴

我意识到弹出窗口只是显示相同的文本,我已经修改了代码,将以前的文本保存为属性,所以弹出窗口可以显示长文本。