1
私はもっと読むようにしてボタンを少なくしています。すべてがかなり働いている、私は文字が限られている制限され、さらにボタンが正常に動作している合計4 divを持っている問題はボタンが特定のdivで動作し、特定のdivで動作しない、私は理解していない何が問題ですか ?トリガーされたボタンをクリックしても、より多くのボタンを読むことができません。
function limitCharacters(){
$('.limit-characters').each(function(){
var element = $(this);
// var element = $('.limit-characters');
var elementHtml = element.html();
element.prepend(elementHtml);
element.find("p:first").addClass("limited");
element.find("p:last").addClass("unlimited hide-element");
var limitedElement = element.find('.limited');
var limitedElementString = limitedElement.text();
var subStringedString = limitedElementString.substring(0,500);
limitedElement.html(subStringedString);
var buttonElement = '<a href="#" class="btn btn-sample3 btn-sm actionButton ">Read More</a>';
element.append(buttonElement);
var button = $(".actionButton");
button.click(function(e){
$(this).parent().find(".unlimited").toggleClass("hide-element");
$(this).parent().find(".limited").toggleClass("hide-element");
$(this).toggleClass("read-less");
if($(this).hasClass("read-less")){
$(this).html("Read Less");
}else{
$(this).html("Read More");
}
e.preventDefault();
});
});
}
.hide-element{
display:none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="limit-characters">
<p>
Had best days of my life ever in Nepal. Wish you all a good time and hope to see you again in my next holiday and I promise to make longer holiday for best memories.Had best days of my life ever in Nepal. Wish you all a good time and hope to see you again in my next holiday and I promise to make longer holiday for best memories.Had best days of my life ever in Nepal. Wish you all a good time and hope to see you again in my next holiday and I promise to make longer holiday for best memories.Had best days of my life ever in Nepal. Wish you all a good time and hope to see you again in my next holiday and I promise to make longer holiday for best memories.
</p>
</div>