JQuery.SlideToggle()不起作用

JQuery.SlideToggle() isn't functioning

本文关键字：不起作用 SlideToggle JQuery      更新时间：2023-09-26
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="MainDesign.master.cs" Inherits="Web_Assignment.MainDesign" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Master Design</title>
    <link href="stylesheets/mainstyle.css" rel="stylesheet" type="text/css" />
    <link rel="shortcut icon" type="image/x-icon" href="images/de_tour_ico.ico" />
    <script>
        var slide = function (div) {
            if ($(div).css('display') === 'none') {
                $(div).delay(300).slideToggle(500);
                return false;
            } else {
                $(div).delay(300).slideToggle(500);
                return false;
            }
        }
    </script>
</head>
<body>
    <div class="wrapper">
        <div class="header">
            <div class="logobox">
                <img class="bottom" src="images/de_tour_hover.png" />
                <img class="top" src="images/de_tour.png" />
            </div>
            <div class="searchdiv">
            </div>
        </div>
        <div class="sidebar">
            <a href="#" onclick="slide('#div1');">Login</a>
            <div id="div1" style="display: none">
                this will show
            </div><hr />
            <ul>
                <li onclick="location.href='#'"><a href="#">Home</a></li>
                <li onclick="location.href='#'"><a href="#">About</a></li>
                <li onclick="location.href='#'"><a href="#">Gallery</a></li>
                <li onclick="location.href='#'"><a href="#">Contact</a></li>
            </ul>
        </div>
        <div class="container"><asp:ContentPlaceHolder ID="ContentPlaceHolder" runat="server"></asp:ContentPlaceHolder></div>
    </div>
</body>
</html>

我想知道为什么当我点击"登录"时它不会切换幻灯片向下?我已经找了好几天了

我想添加一个id:和密码:在滑动div和可能隐藏它回来当"登录"再次点击

确保首先包含jQuery库!修改jquery代码，如下所示:

<script type='text/javascript'>
      function slide(div) {
            if ($(div).is(':hidden')) {
                $(div).delay(300).slideToggle(500);
                return false;
            } else {
                $(div).delay(300).slideToggle(500);
                return false;
            }
        } 
</script>

你可以在这里看到演示--> http://jsfiddle.net/Junkie/36ueV/

她为你:http://jsfiddle.net/2EqCT/

如您所见，切换工作正常不要忘记添加jquery库;)

$('a#foryu').click( function() { slide('#div1'); return false; } );
function slide(div) {
            console.log("test");
            if ($(div).css('display') === 'none') {
                $(div).slideToggle(500);
                return false;
            } else {
                $(div).slideToggle(500);
                return false;
            }
        }

和请:)考虑从你的js代码调用函数，而不是从HTML标签(JavaScript函数在href vs. onclick)

相关文章：