Question

我正在学习Jquery的fadeIn和fadeOut函数的基础知识。我认为它会成功，但它不起作用。控制台说我没有定义$。我该如何定义？有任何线索吗？我的JSFiddle是here

HTML：

<div id="example"></div>
<div id="box"></div>

CSS：

.#example{
    top:0px;
    left:0px;
    width:50%;
    height:500px;
    background-color:black;
    display:none;
}
#box{
    margin:auto;
    width:50px;
    height:50px;
    background-color:black;    
}

Jquery的：

$("#box").click(function(){
    $("#example").fadeIn("normal");
});

$("#box").click(function(){
    $("#example").fadeOut("slow");
});

Answer 1

这是你想要的吗？（你在JSFiddle中有一些错误，你必须在左侧菜单（框架）上调用jQuery）

<强> CSS

#example{
    top:0px;
    left:0px;
    width:50%;
    height:500px;
    background-color:black;
    display:none;
}
#box{
    margin:auto;
    width:50px;
    height:50px;
    background-color:black;    
}

<强>的jQuery

    $("#box").click(function(){
    $("#example").fadeToggle("slow");
});

<强> DEMO HERE

Answer 2

代码中的

$表示您正在使用jquery函数。

“$ not defined”通常表示未加载jquery，请确保加载jquery

Answer 3

在CSS中的#example之前有一个点（。） - 只需删除它。

不要让两个事件处理程序在一个DOM元素上侦听同一个事件，因为你永远不会知道首先调用哪一个。

最好做这样的事情：

var active = false;
$("#box").click(function () {
    if (active) {
        $("#example").fadeOut("slow");
        active = false;
    } else {
        $("#example").fadeIn("normal");
        active = true;
    }
});

尝试一下：

http://jsfiddle.net/57wyxe02/9/

希望有所帮助！

FadeIn FadeOut错误 - “$ not defined”

3 个答案: