jQuery-阅读更多/阅读更少.如何替换文字? [英] jQuery - Read More / Read Less. How to replace text?
本文介绍了jQuery-阅读更多/阅读更少.如何替换文字?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
HTML:
<a href="#" class="show_hide" data-content="toggle-text">Read More</a>
jQuery:
// Slide Up Slide Down
$('.show_hide').toggle(function(){
$(this).text().replace("Read More", "Read Less");
$('.' + $(this).attr('data-content')).slideDown();
},function(){
$(this).text().replace("Read Less", "Read More");
$('.' + $(this).attr('data-content')).slideUp();
});
我正在尝试使其中的更多/更少"按钮之一隐藏和显示文本.
如何在点击时将阅读更多"替换为阅读较少"?
I am trying to make one of those "Read More / Read Less" buttons to hide and show text.
How do I replace "Read More" with "Read Less" on click?
非常感谢您的投入!
推荐答案
您还可以使用:visible
检查内容是否可见并相应地更改文本.
You could also use :visible
to check if content is visible and change text accordingly.
$(document).ready(function () {
$(".content").hide();
$(".show_hide").on("click", function () {
var txt = $(".content").is(':visible') ? 'Read More' : 'Read Less';
$(".show_hide").text(txt);
$(this).next('.content').slideToggle(200);
});
});
JSFiddle Demo
这篇关于jQuery-阅读更多/阅读更少.如何替换文字?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文