在mvc3项目中帮助Ajax slideUp / show

Question

我想在一个项目中使用一些ajax，但我似乎无法让它工作，只是为了尝试一下我在我的一个视图中创建了一个按钮，我想要隐藏（slideUp）整个体

我在我的视图中尝试过这段代码：

<script src="@Url.Content("http://code.jquery.com/jquery-latest.js")></script>

 <script type="text/javascript" >$("button#hideAll").click(function ()
         {
            if ($("body").is(":hidden")) {
                  $("body").show("slow");
            } else {
                  $("body").slideUp();
                   }
             });{
 </script>

ps：如果您对布局等有任何其他评论，我也很高兴听到它们。

编辑： 这是更多的HTML代码btw：

<p id="uitlegToonStudenten">Hieronder ziet u 2 lijsten van studenten. U kan één of meerdere studenten selecteren om hen naar de andere lijst van studenten te verplaatsen.</p>
<hr>

<button id="hideAll">hide All!</button>

编辑： 更新代码（仍然不起作用：）

<button id="hideAll">hide All!</button>
<div id="bodyFake">

<p id="uitlegToonStudenten">Hieronder ziet u 2 lijsten van studenten. U kan één of meerdere studenten selecteren om hen naar de andere lijst van studenten te verplaatsen.</p>
<hr>

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("http://code.jquery.com/jquery-latest.js") type="text/javascript"></script>

 <script type="text/javascript" >
  $(function () {
         $("button#hideAll").click(function () {
             if ($("div#bodyFake").is(":hidden")) {
                 $("div#bodyFake").slideDown();
             } else {
                 $("div#bodyFake").slideUp();
             }
         });
     });
 </script>

正如你所看到的那样，我把所有东西放在一个'假的'身体div中并把按钮放在上面（有更多的代码，我最后关闭了div） 的 EDIT2： 这是“大错误”：

<script src="http://code.jquery.com/jquery-1.6.2.js" type="text/javascript"></script>

Answer 1

以$(function(){..}方式包裹您的代码，以确保该元素在尝试访问之前可用。同样要显示元素，您可以使用与slideDown相反的slideUp。您的代码中有一个额外的左括号将其删除。你可以试试这个。

正在使用 demo

  $(function () {
     $("#hideAll").click(function () {

         if ($("div#bodyFake").is(":hidden")) {
             $("div#bodyFake").slideDown();
         } else {
             $("div#bodyFake").slideUp();
         }
     });
  });