javascript - if esleでslideDownを実行

Question

同じページに 2 つの部分で構成されるフォームがあります。

<p>要素をフォームのパート 2 にしたい。は非<p>表示にする必要があり、フォームの最初の部分が入力されたときにのみ表示されます。そのため、フォームに入力して [次へ] をクリックすると、フォームが下に<p>スライドしてフォームの残りの部分が表示されます。

$(document).ready(function(){
  $(".btn1").click(function(){
    $("p").slideUp();
  });
  $(".btn2").click(function(){
    $("p").slideDown();
  });
});

Answer 1

あなたが提供した情報に基づいて、私はあなたがこれを探していると思います:-

HTML:-

<input type="button" id="btn1" value="Prev">
<input type="button" id="btn2" value="Next">
<div>welcome to mypage
    fill all the fields :- Form 1</div>
<p style="display:none">
    Now Fill this section :- Form 2
</p>

JS:-

$(document).ready(function(){
  $("#btn1").click(function(){
    $("p").slideUp();
  });
  $("#btn2").click(function(){
    $("p").slideDown();
  });
});

デモを見る

Answer 2

両方のパーツを id を持つ 2 つの div に配置し、2 番目の div にスタイル表示なしを設定します。

style="display:none"

そして、これを使用します。

$(document).ready(function(){
  $(".btn1").click(function(){
    $("div2").show();
    $("div1").hide().slideUp();
  });
  $(".btn2").click(function(){
    $("div1").show();
    $("div2").hide().slideDown();
  });
});