替换“隐藏/显示"上的链接文本 [英] Replacing link text on Hide/Show

问题描述

我确定这个问题将需要你们3秒钟的时间来回答，但是我很困惑.单击启用提示"后，文本将按预期更改为禁用提示"，但是单击禁用提示"后，该文本不会再次重置为启用提示".有什么想法我做错了吗?

I'm sure this question will take one of you 3 seconds to answer but I'm stumped. After I have clicked "Enable Tips" the text changes to "Disable Tips" as expected, but after you click "Disable Tips" the text doesn't reset to "Enable Tips" again. Any ideas what I'm doing wrong?

  // function to toggle tips
    $(document).ready(function(){
    $(".help").hide();
    document.getElementById("help_trigger").innerHTML = "Enable Tips";
    $("a#help_trigger").click(function(){
    $(".help").toggle("400");
    document.getElementById("help_trigger").innerHTML = "Disable Tips";
    return false;
    });
    });

HTML

  <a id="help_trigger" href="">Enable Tips</a>             
      <div class="help" style="display: none">something</div>
           <div class="help" style="display: none">something else</div>

推荐答案

在点击处理程序中，您需要测试当前值并将其设置为相反值.由于您已经在使用jQuery，因此您真的应该对所有内容都使用它.

In your click handler, you need to test for the current value and set it to the opposite. Since you're using jQuery already, you really ought to use it for everything.

$(function(){ // short-hand is cleaner, IMO
    $(".help").hide();
    $("#help_trigger")
        .text( "Enable Tips" )
        .click(function(){
            var $this = $(this);
            $(".help").toggle("400");
            if ($this.text().match(/Disable/i)) {
                $this.text("Enable Tips");
            }
            else {
                $this.text("Disable Tips");
            }
           return false;
    });
});

这篇关于替换“隐藏/显示"上的链接文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！