javascript - 尝试在 JQUERY 中显示更多文本时，我无法让 .show 工作

Question

我想阻止用户看到一堵文字墙，并将其分成三个按钮，这些按钮将隐藏按钮并显示其他信息。我遇到的问题是我的按钮仅隐藏自身(这是我想要的)，但我想要显示的文本始终已显示。我尝试过使用 <p> 的类和 id我想展示但这没有帮助有人知道为什么吗？我在下面有一个例子。任何帮助将不胜感激

$(document).ready(function(){
    $(" button ").click(function(){
        $("button").hide();
    });
    $(" button ").click(function(){
        $(".2").show(); 
    });
    
});

#2 {
  font-size: 16px;
  line-height: 1.5;
  margin-bottom: 20px;

}

<button class="btn btn-default btn-xl sr-button" id="click">Tell me more</button>

<p class="2">When you buy something on a Credit Card all your transactions from one month will be bundled together into a statement and you will be asked to clear at least some of the debt off which is called a “Minimum payment” this however will mean that you will start to be charged interest on your balance. If you clear the balance in full however you will not be charged and get to benefit from things such as additional protection from fraud and any rewards your card offers. You can set up a direct debit to clear the balance every month so that you don’t forget.</p><br>

<p class="2">Credit Cards can be a great way to build your Credit Score as if you spend within your limits and clear the balance you will prove that you are able to manage your money by not overspending and this will have a positive effect on trying to obtain credit in the future such as a loan or a mortgage. </p><br>

<p class="2">Some cards come with interest free periods when you take out a card where you will only need to pay the minimum balance for the first few months but then if you do not clear the remaining balance you will be charged interest which is usually around the 17% mark so this is not cheap. Credit Cards are incredibly flexible and useful tools if used responsibly if you run up a balance on a Credit Card that you are unable to clear it may be worth using a feature called a Balance Transfer to a card that has an interest free period you will still need to make the minimum payment but this can be a much cheaper way to repay the debt. </p><br>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

Answer 1

如果我正确理解你的问题，你想最初隐藏文本，并在单击按钮时显示它吗？这应该适合你。

$(document).ready(function() {
  // hide the paragraphs initially
  $(".two").hide();
  
  // when the button is clicked, hide it and show the paragraphs
  $('#click').click(function() {
    $(this).hide();
    $(".two").show();
  });
});

.two {
  font-size: 16px;
  line-height: 1.5;
  margin-bottom: 20px;
}

<button class="btn btn-default btn-xl sr-button" id="click">Tell me more</button>

<p class="two">When you buy something on a Credit Card all your transactions from one month will be bundled together into a statement and you will be asked to clear at least some of the debt off which is called a “Minimum payment” this however will mean that you will
  start to be charged interest on your balance. If you clear the balance in full however you will not be charged and get to benefit from things such as additional protection from fraud and any rewards your card offers. You can set up a direct debit to
  clear the balance every month so that you don’t forget.</p>
<br>

<p class="two">Credit Cards can be a great way to build your Credit Score as if you spend within your limits and clear the balance you will prove that you are able to manage your money by not overspending and this will have a positive effect on trying to obtain credit
  in the future such as a loan or a mortgage.</p>
<br>

<p class="two">Some cards come with interest free periods when you take out a card where you will only need to pay the minimum balance for the first few months but then if you do not clear the remaining balance you will be charged interest which is usually around the
  17% mark so this is not cheap. Credit Cards are incredibly flexible and useful tools if used responsibly if you run up a balance on a Credit Card that you are unable to clear it may be worth using a feature called a Balance Transfer to a card that has
  an interest free period you will still need to make the minimum payment but this can be a much cheaper way to repay the debt.</p>
<br>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

另一种方法是首先使用 CSS 隐藏文本，如下所示:

.two {display: none;}

或者:

<p class="two" style="display: none;">

只需 .click()调用您的 JavaScript。