jquery - 使用 jQuery 的点击事件

Question

friend 们大家好，我是 jQuery 的新手，正在尝试制作切换效果。我的代码工作正常，但我也想切换其中的文本，请检查以下代码

脚本

$('.read_more_list').click(function() {
    $(".design_list").slideToggle();
    if ($(this).children('a').html() == 'more') {
        $(this).children('a').html('less');
    }
    if ($(this).children('a').html() == 'less') {
        $(this).children('a').html('more');
    }
})​

HTML

<ul class="design_list" style="display: none;">
            <li><a href="#">eCommerce</a></li>
            <li><a href="#">Display  Creatives</a></li>
            <li><a href="#">Logo Design  Services</a></li>
            <li><a href="#">Microsites</a></li>
          </ul>
<div class="read_more_list"><a href="javascript:void(0);">more</a></div>

我希望当用户单击more时，它将转换为less，当用户再次单击它时，它将变为more

请帮助我的 friend 提前谢谢...:))

Answer 1

jsBin demo

$('.read_more_list a').click(function(e){  
    e.preventDefault();

    $(".design_list").slideToggle();
    $(this).text( $(this).text()=='more'?'less':'more' );

});

HTML:

<a href="#">more</a>

• 您的 A 按钮不需要内联 JS void 或任何内容，只需使用事件处理程序 event.preventDefault()。
  <
• 要切换文本，您可以使用简单的三元运算符$(this).text()=='more'?'less':'more'

只是为了提醒您有关三元的信息:[statement] ? [如果为真] : [如果为假] ;