Question

亲爱的，

我有一段时间遇到了以下问题。请帮帮我！

这是我的代码：

HTML

<html>

<head>
  <meta charset="utf-8" />


  <!--css stylesheet-->
  <link href="style.css" rel="stylesheet" />

  <!--jQuery external javascript - CDN-->
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
  <link href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" rel="stylesheet" />

</head>

<body>

  <div class="header"></div>

  <div class="content"><input type="button" id="sendData" value="send your data" align="center"></div>

  <div class="barChart"><input type="button" id="reenterButton" value="Re-enter">     </div>

</body>

</html>

CSS

.content {
  text-align: center;
  background-color: white;
  width: 650px;
  height: 650px;
  display: inline-block;
  position: relative;
}



.barChart {
  text-align: center;
  background-color: white;
  width: 650px;
  height: 650px;
  display: inline-block;
  position: relative;
  display: none;            // Make .barchart hide initially
}

的Javascript

<script type="text/javascript">
$(document).ready(function() {

  $("#sendData").button()                   
                .click(function() {        
                  $("div.content").hide("slide", {direction: "left"}, "slow", function() {
                    $("div.barChart").show("slide", {direction: "right"}, "slow");
                  });
                 }); 

  $("#reenterButton").button()
                 .click(function() {
                  $("div.barchart").hide("slide", {direction: "right"}, "slow", function() {   
                    $("div.content").show("slide", {direction: "right"}, "slow");
                  });
                 });
});
</script>

#sendData 按钮正常工作，但点击 #reenterButton 不会处理第二个语句（带选择器的那个语句（“div.barchart”））。

.barchart 在重新输入按钮上应用单击操作后不会隐藏。

情况是否与我在css文件中设置的div状态有关？或其他什么？

感谢您的帮助！

Answer 1

您在第二次点击绑定时输入了拼写错误，而不是$("div.barchart")它应该是$("div.barChart")

Fiddle

jQuery hide（）不能正常工作

1 个答案: