Question

我有数据，当我点击Show More时，它会显示数据并且Show More消失。数据和新按钮Show Less出现。当我点击Show Less时，数据会再次消失。如果点击Show More，如何才能显示Show Less？

我的HTML代码是：

<button id="show">Show More</button>
<div id="complete">
    <img src="Pictures/xerox.png" height="20%" width="20%">
</div>
<p>
<button id="hide">Show Less</button>

我的Jquery代码是：

$(document).ready(function(){
    $("#show").click(function(){
        $(this).parent().addClass("more");
        $(this).hide();
        $("#complete").show();
    });

    $("#hide").click(function(){
        $("#complete").hide();
    });
});

Answer 1

看起来你的jQuery告诉对象在点击时调用隐藏自己：

$(this).hide();

根据您的描述，我建议您将以下内容添加到处理Show Less功能的函数中：

$('#show').show();

Answer 2

我从问题中理解这是你想要的

<style>
 #complete{
 display:none;
}
 #hide{
 display:none;
}
</style>

<button id="show">Show More</button>
<div id="complete">
 <img src="Pictures/xerox.png" height="20%" width="20%">
</div>
<p>
<button id="hide">Show Less</button>


<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>

<script>
 $(document).ready(function(){
   $("#show").click(function(){
      $(this).parent().addClass("more");
      $(this).hide();
      $("#hide").show();
      $("#complete").show();
  });

  $("#hide").click(function(){
      $("#complete").hide();
      $("#show").show();
      $("#hide").hide();
   });
 });
</script>

如何使用Jquery使按钮消失，然后重新开始？

2 个答案: