代码之家 › 专栏 › 技术社区 › Dev

停止所有按钮上的按钮文本更改

slidetoggle toggle button html jquery

Dev · 技术社区 · 8 年前

$('.entry-content #toggle').click(function() {

var elem = $('#toggle').text();

if (elem == 'Read More') {

$('.entry #toggle').text('Read Less');

} else {

$('.entry #toggle').text('Read More'); 

}

});

这个jQuery更改归档页面上每篇文章上所有按钮上的按钮文本。我只想让它改变被点击的按钮。

<div id="toggle" class="btn">Read More</div>

<div class="text" />

更新2:

$('#toggle').click(function() {

$(this).closest('.post').find('.text').slideToggle();

$(this).text(function( i, v ) {

   return v === 'Read More' ? 'Read Less' : 'Read More'


      });
});

3 回复 | 直到 8 年前

dvr 8 年前

在事件中引用您自己的按钮。

$('.entry-content #toggle').click(function() {

var elem = $(this).text();

if (elem == 'Read More') {

$(this).text('Read Less');

} else {

$(this).text('Read More'); 

}

});

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this

Saw Zin Min Tun 8 年前

$('#toggle').click(function() {

    var elem = $(this).text();

    if (elem == 'Read More') {
        $(this).text('Read Less');
    } else {
        $(this).text('Read More'); 
    }

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="toggle" class="btn">Read More</div>

<div class="text" />

user8493027 user8493027 8 年前

简化代码。

$('#toggle').click(function() {
    $(this).text(function(i, v){
       return v === 'Read More' ? 'Read Less' : 'Read More'
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="toggle" class="btn">Read More</div>

<div class="text" />

推荐文章

Dev · 停止所有按钮上的按钮文本更改

8 年前

JordanBarber · 根据用户对javascript“确认”的响应更改材质滑动切换的值

8 年前

Huma Ali · 单击时向上滑动

10 年前

730wavy · jQuery slidetoggle()divs使用多个id

10 年前

user5278424 · 只有1个div切换而不是全部

11 年前

margo · 角度ng向下滑动模块

11 年前

Eugene Balashov · 当你点击一个滑动div的外部时,如何使它成为一个关闭的div?

12 年前

NealR · jQuery-使用slideToggle功能呈现多个div元素

13 年前

Michael Libman · 如何使用jQuery使底部导航上下滑动?

13 年前