部分文字列で変更した後に古いテキストを取得する方法は？

Question

ここで私は各divテキストを表示しようとしていますが、divテキストの方が190ワードのほうが大きい場合は1903ワードしか表示されません。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> 

これは私がポップアップボックスに古いフルテキストと表示へのアクセス方法、$('.read').click()で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> 

で試したものです???

Answer 1

あなたのコードの問題は、これらの要素が作成された後に.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); 
    }); 
    }); 

は、このコードを見てください：

fiddle

私はポップアップがちょうど同じテキストを表示することを実現し、私は属性として、以前のテキストを保存するためのコードなので、ポップアップを変更しました長いテキストを表示することができます。