Question

我正在玩JQuery并尝试制作一个简单的程序。基本上，我想要一个切换段落可见性的按钮，我希望按钮上的文本随着“p”的可见性而改变。第一部分有效，第二部分没有。

我知道还有其他问题要问这类事情，但我试图模仿这么多不同的东西而无法得到结果，所以我想我只是问。这是我现在的代码。

<script>  $(document).ready(function(){

        $("button").click(function(){

   $("p").toggle();

        });
    });

if (p.style.visibility==="hidden")
   {
       $("button").text("show text");
   }
   else
   {
       $("button").text("hide text");
   }

    </script>

我如何使这项工作？

Answer 1

不检查可见性是否已更改，请检查显示屏是否有。 .toggle()不会改变可见性。

if (p.style.display==="none")
   {
       $("button").text("show text");
   }
   else
   {
       $("button").text("hide text");
   }

有更好的方法可以做到这一点，但这应该有用。

Answer 2

首先，将你的代码放在onclick函数中：

 $("button").click(function(){
   $("p").toggle();
   // change your text here
});

其次，p未在任何地方声明。用$（＆＃39; p＆＃39;）选择它。而不是检查其可见性，您可以切换级别＆＃39;活动＆＃39;并检查p是否有活动类。

Answer 3

＆＃13;

    $(document).ready(function(){

      $("button").click(function(){
        $("p").toggle();

        // Check it inside here and select p correctly
        if( $("p").is(":visible")){
          $("button").text("hide text");
        } else {
          $("button").text("show text");
        }
      });

    });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button>Hide text</button>
<p>Hi, this is text!</p>

＆＃13;

JQuery切换按钮更改文本

3 个答案: