JQuery 不工作。（功能）

Question

所以当我输入

$(document).ready(function() {
    $(".fancybox").fancybox();
});

在上面

$(function() {  
    jQuery.scrollSpeed(1920, 800); 
});

$(document).ready(function(e) {
    $("#open-io").click(function (){
        //console.log("asdfasdf");
        $("#navi").addClass("expand");
    });

    $("#close-io").click(function (){
        //console.log("asdfasdf");
        $("#navi").removeClass("expand");
    });
});

没有全部工作。

但是如果我把最上面的一个放到最下面的一个看起来像这样

$(function() {  
    jQuery.scrollSpeed(1920, 800); 
});

$(document).ready(function(e) {
    $("#open-io").click(function (){
        //console.log("asdfasdf");
        $("#navi").addClass("expand");
    });

    $("#close-io").click(function (){
        //console.log("asdfasdf");
        $("#navi").removeClass("expand");
    });
});

$(document).ready(function() {
    $(".fancybox").fancybox();
});

平滑滚动正常，但花式框不工作。帮我解决这个问题。我是新手，可能看不懂。

这是我的 body/body

<script src="js/modernizr.custom.37797.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/jQuery.scrollSpeed.js"></script>
<script src="js/parallax.js"></script>

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="fancybox/source/jquery.fancybox.pack.js"></script>
<script src="fancybox/lib/jquery.mousewheel-3.0.6.pack.js"></script>

<script type="text/javascript">
  $(function() {
    jQuery.scrollSpeed(1920, 800);
  });

  $(document).ready(function(e) {
    $("#open-io").click(function() {
    //console.log("asdfasdf");
    $("#navi").addClass("expand");
  });

  $("#close-io").click(function() {
    //console.log("asdfasdf");
    $("#navi").removeClass("expand");
  });
</script>

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

这是link

<link rel="stylesheet" href="fancybox/source/jquery.fancybox.css" type="text/css" media="screen"/>

这是控制台显示的内容，

Horizontal_MouseWheel_Parallax.html:6 GET file:///C:/fancybox/source/jquery.fancybox.css net::ERR_FILE_NOT_FOUND Horizontal_MouseWheel_Parallax.html:217 GET file:///C:/js/modernizr.custom.37797.js net::ERR_FILE_NOT_FOUND Horizontal_MouseWheel_Parallax.html:218 GET file:///C:/js/jQuery.scrollSpeed.js net::ERR_FILE_NOT_FOUND Horizontal_MouseWheel_Parallax.html:219 GET file:///C:/js/parallax.js net::ERR_FILE_NOT_FOUND Horizontal_MouseWheel_Parallax.html:221 GET file:///C:/fancybox/lib/jquery.mousewheel-3.0.6.pack.js net::ERR_FILE_NOT_FOUND Horizontal_MouseWheel_Parallax.html:222 GET file:///C:/fancybox/source/jquery.fancybox.pack.js net::ERR_FILE_NOT_FOUND Horizontal_MouseWheel_Parallax.html:227 Uncaught TypeError: jQuery.scrollSpeed is not a function(anonymous function) @ Horizontal_MouseWheel_Parallax.html:227j @ jquery-latest.min.js:2k.fireWith @ jquery-latest.min.js:2m.extend.ready @ jquery-latest.min.js:2J @ jquery-latest.min.js:2

Answer 1

可能有几件事，但我会执行以下操作来解决问题：

1) 按如下方式重新排列您的 JavaScript 导入。此外，在源路径中添加一个前导斜杠 (/)，否则导入将无法在嵌套页面上工作（你应该使用 absolute 路径，你的路径当前是相对)。

（我还删除了重复的 jQuery 导入）

<link rel="stylesheet" href="/fancybox/source/jquery.fancybox.css" type="text/css" media="screen" />    

<script src="http://code.jquery.com/jquery-latest.min.js"></script>   
<script src="/js/modernizr.custom.37797.js"></script> 
<script src="/js/jQuery.scrollSpeed.js"></script>
<script src="/js/parallax.js"></script>

<script src="/fancybox/lib/jquery.mousewheel-3.0.6.pack.js"></script>
<script src="/fancybox/source/jquery.fancybox.pack.js"></script>

2) 将 JavaScript 合并为一个 $(document).ready 函数：

（我还将您的 .click 处理程序更新为推荐的 .on 处理程序）

// This could also start with the following line
// $(function() {
$(document).ready(function() {   

  jQuery.scrollSpeed(1920, 800);
  $(".fancybox").fancybox();

  $("#open-io").on('click', function (){
    //console.log("asdfasdf");
    $("#navi").addClass("expand");
  });

  $("#close-io").on('click', function (){
    //console.log("asdfasdf");
    $("#navi").removeClass("expand");
  });

});

试试看是否有帮助。

让我知道你找到了什么。

Answer 2

好的。我刚刚做对了。

所以我重新排列 JQuery 并且我还删除了

中的 1 个

jquery.min.js

所以整体看起来像这样

<script src="js/modernizr.custom.37797.js"></script> 
<script src="js/jquery.min.js"></script>
<script src="js/jQuery.scrollSpeed.js"></script>
<script src="js/parallax.js"></script>
<link rel="stylesheet" href="fancybox/source/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
<script type="text/javascript" src="fancybox/source/jquery.fancybox.pack.js?v=2.1.5"></script>

$(document).ready(function() {我也用你帮我整理的那个

$(document).ready(function() {   

jQuery.scrollSpeed(1920, 800);
$(".fancybox").fancybox();

$("#open-io").on('click', function (){
 //console.log("asdfasdf");
 $("#navi").addClass("expand");
});

$("#close-io").on('click', function (){
 //console.log("asdfasdf");
 $("#navi").removeClass("expand");
});

});

而且我也没有在我的路径中添加斜杠。如果我添加它，它将不起作用。

工作

fancybox/source/jquery.fancybox.pack.js

不工作

/fancybox/source/jquery.fancybox.pack.js

JQuery 不工作。 （功能）

JQuery not working. (Function)

javascript

jquery

fancybox

JQuery 不工作。（功能）