2

亲爱的大家，

我已经面临以下问题一段时间了。请帮帮我！

这是我的代码：

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按钮工作正常，但在第二个语句（带有选择器（“div.barchart”）的那个）上单击#reenterButton不起作用。

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

这种情况和我在css文件中设置的div状态有关吗？或者是其他东西？

感谢帮助！

4

1 回答 1

1

您在第二次点击绑定上有错字，而不是 $("div.barchart")应该是$("div.barChart")

小提琴

于 2013-04-09T07:00:04.057 回答