Question

这是我的代码。 https://jsfiddle.net/3phzezfj/3/

function showhidediv(rad){
var rads=document.getElementsByName(rad.name);
document.getElementById('one').style.display=(rads[0].checked)?'block':'none' ;
document.getElementById('two').style.display=(rads[1].checked)?'block':'none' ;
document.getElementById('three').style.display=(rads[2].checked)?'block':'none' ;
    document.getElementById('four').style.display=(rads[3].checked)?'block':'none' ;
}

function switchVisible()

    {
      $("#newpost").hide();
      $("#newpost2").show();
    }

    function previousVisible()
    {
     $("#newpost").show();
        $("#newpost2").hide();
    }

如果我点击它后如何让下一个按钮消失但是如果我按下它会重新出现？

感谢。

Answer 1

您可以使用toggle（）;

说明：显示或隐藏匹配的元素。

$("#newpost2").toggle();

如果隐藏#newpost2，它会显示它，如果显示，它会隐藏它。

Answer 2

而不是onclick使用addEventListener进行点击活动我在这里编辑了您的代码codepen

您不必像这样混合js和jquery document.getElementById('four')和$("#newpost")
最好决定你要使用哪一个

Answer 3

你的小提琴没有包括jquery js。

请检查更新的小提琴here。

附上事件处理程序，如下所示。

$("#btnBack").click(previousVisible);
$("#btnNext").click(switchVisible);

并将div中的Next按钮移动。

希望这是你想要实现的目标。

Answer 4

我认为这是你想要的吗？

＆＃13;

description/Q0RFU0NJRDQ=/Achalasia 

description/Q0RFU0NJRDM=/Acetaminophen (Tylenol) Poisoning

＆＃13;

var check = 0;
$(document).ready(function() {
  $("#Button1").click(function() {
    if(check == 0)
    {
    	$("#Button1").hide();
    }
  });
  $("#Button2").click(function() {
    if(check == 0)
    {
    	$("#Button1").show();
    }
  });
});

＆＃13;

.btnSubmit {
  background-color: #7f0000;
  background-image: -webkit-linear-gradient(top, #7f0000, #6c0404);
  background-image: -moz-linear-gradient(top, #7f0000, #6c0404);
  background-image: -o-linear-gradient(top, #7f0000, #6c0404);
  background-image: -ms-linear-gradient(top, #7f0000, #6c0404);
  background-image: linear-gradient(top, #7f0000, #6c0404);
  border: 0;
  text-transform: uppercase;
  color: white;
  font-size: 14px;
  font-weight: bolder !important;
  height: 42px;
  padding: 0 20px;
  margin: 0;
  text-shadow: -1px -1px 2px 2px #000, 1px 1px 2px 2px #aa4242;
  border-bottom: 1px solid #383838;
  font-family: garamond, serif;
  text-shadow: 1px -1px 0px #090909;
  width: 150px;
  color: white;
}

＆＃13;

Answer 5

按钮消失!!

＆＃13;

$("#next").click(function(){
    $("#next").hide();
    $("#back").show();
});
$("#back").click(function() {
    $("#back").show();
    $("#next").show();
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<input type="button" id="next" value="Next"/>
<input type="button" id="back" value="Back"/>

＆＃13;

单击后如何使按钮消失？

5 个答案: