Javascript 我的外部jQuery文件有什么问题？_Javascript_Jquery_Html

Javascript 我的外部jQuery文件有什么问题？

javascript jquery html

Javascript 我的外部jQuery文件有什么问题？,javascript,jquery,html,Javascript,Jquery,Html,我正在制作一个图像幻灯片。目前，我已将事件附加到H1元素。这是我的代码，存储在文件夹jq中的文件main.js：- 更新代码：注意：我是一个可以在jQuery中将其归类为NOOB的人在向其添加项目之前，需要初始化名为image的对象或数组 var image = {}; image[3] = "http://farm5.static.flickr.com/4006/5131022085_62876bbfbd_b.jpg"; image[2] = "http://far

我正在制作一个图像幻灯片。目前，我已将事件附加到H1元素。这是我的代码，存储在文件夹

jq

中的文件

main.js

：-

更新代码：

注意：我是一个可以在jQuery中将其归类为NOOB的人

在向其添加项目之前，需要初始化名为

image

的对象或数组

    var image = {};
    image[3] = "http://farm5.static.flickr.com/4006/5131022085_62876bbfbd_b.jpg";
    image[2] = "http://farm6.static.flickr.com/5201/5289991939_46a20dd9fd_o.jpg";
    image[1] = "http://farm3.static.flickr.com/2127/5807551517_72d39a1d19_b.jpg";

如果您的函数是唯一使用

image

的函数，我会将其从函数中取出，并在iLife中确定其范围：

(function($) {
    var image = {};
    image[3] = "http://farm5.static.flickr.com/4006/5131022085_62876bbfbd_b.jpg";
    image[2] = "http://farm6.static.flickr.com/5201/5289991939_46a20dd9fd_o.jpg";
    image[1] = "http://farm3.static.flickr.com/2127/5807551517_72d39a1d19_b.jpg";

    function browseImages(type) {
          // you could take `imageObject` out of this function as well if the
          //    element with the ID "image" never changes.
          //  v--------------------------------------------------------------
        var imageObject = $("#image");
        var selection;

        if (type == "left") {
            for (var i=1; i < Things.length; i++) {
                if (imageObject.attr("src") == Things[i]) {
                    selection = i;
                }  // <--- removed semi-colon
            }  // <--- removed semi-colon

              // v----- use the cached object
            imageObject.attr("src",image[selection]);
        } else {
            for (var i=1; i < Things.length; i++) {
                if (imageObject.attr("src") == Things[i]) {
                    selection = i;
                }  // <--- removed semi-colon
            }  // <--- removed semi-colon

              // v----- use the cached object
            imageObject.attr("src",image[selection]);
        }  // <--- removed semi-colon
    }


    init = function() {
        $("h1").click( function() {
            browseImages("left")
        });
    };
})( jQuery );

您需要初始化名为

image

的对象或数组，然后才能向其中添加项

    var image = {};
    image[3] = "http://farm5.static.flickr.com/4006/5131022085_62876bbfbd_b.jpg";
    image[2] = "http://farm6.static.flickr.com/5201/5289991939_46a20dd9fd_o.jpg";
    image[1] = "http://farm3.static.flickr.com/2127/5807551517_72d39a1d19_b.jpg";

如果您的函数是唯一使用

image

的函数，我会将其从函数中取出，并在iLife中确定其范围：

(function($) {
    var image = {};
    image[3] = "http://farm5.static.flickr.com/4006/5131022085_62876bbfbd_b.jpg";
    image[2] = "http://farm6.static.flickr.com/5201/5289991939_46a20dd9fd_o.jpg";
    image[1] = "http://farm3.static.flickr.com/2127/5807551517_72d39a1d19_b.jpg";

    function browseImages(type) {
          // you could take `imageObject` out of this function as well if the
          //    element with the ID "image" never changes.
          //  v--------------------------------------------------------------
        var imageObject = $("#image");
        var selection;

        if (type == "left") {
            for (var i=1; i < Things.length; i++) {
                if (imageObject.attr("src") == Things[i]) {
                    selection = i;
                }  // <--- removed semi-colon
            }  // <--- removed semi-colon

              // v----- use the cached object
            imageObject.attr("src",image[selection]);
        } else {
            for (var i=1; i < Things.length; i++) {
                if (imageObject.attr("src") == Things[i]) {
                    selection = i;
                }  // <--- removed semi-colon
            }  // <--- removed semi-colon

              // v----- use the cached object
            imageObject.attr("src",image[selection]);
        }  // <--- removed semi-colon
    }


    init = function() {
        $("h1").click( function() {
            browseImages("left")
        });
    };
})( jQuery );

您使用闭包来保护全局范围（这很好），但忘记了为功能提供外部接口

您的代码并不完全清楚，但我想您想要的是这样的：

// inside your browseImages function
var imageObject = $(this);

// somewhere near the bottom
$.fn.browseImages = browseImages; // so that you can use it like

而且你在

init（）函数中所做的事情并不真正属于你正在制作的插件。您可以将整个init函数直接移动到$（document）.ready（…）

更新
main.js的完整代码
(function($) {
    $.fn.browseImages = function(type) {
        var image = [];
        image[3] = "http://farm5.static.flickr.com/4006/5131022085_62876bbfbd_b.jpg";
        image[2] = "http://farm6.static.flickr.com/5201/5289991939_46a20dd9fd_o.jpg";
        image[1] = "http://farm3.static.flickr.com/2127/5807551517_72d39a1d19_b.jpg";

        var imageObject = $(this);
        var selection;

        if (type == "left") {
            for (var i=1; i < Things.length; i++) {
                if (imageObject.attr("src") == Things[i]) {
                    selection = i;
                }
            }
            imageObject.attr("src",image[selection]);
        } else {
            for (var i=1; i < Things.length; i++) {
                if (imageObject.attr("src") == Things[i]) {
                    selection = i;
                }
            }
            imageObject.attr("src",image[selection]);
        };
    }

})(jQuery);

$(function() { // <-- equivalent to $(document).ready(...)
    $("h1").click(function() {
        $('#image').browseImages("left");
    });
});

（函数（$）{
$.fn.browseImages=函数（类型）{
var图像=[]；
图像[3]=”http://farm5.static.flickr.com/4006/5131022085_62876bbfbd_b.jpg";
图像[2]=”http://farm6.static.flickr.com/5201/5289991939_46a20dd9fd_o.jpg";
图像[1]=”http://farm3.static.flickr.com/2127/5807551517_72d39a1d19_b.jpg";
var-imageObject=$（这个）；
var选择；
如果（类型=“左”）{
for（var i=1；i$（function（）{/您使用闭包来保护全局范围（这很好），但忘记了为功能提供外部接口
您的代码并不完全清楚，但我想您想要的是这样的：
// inside your browseImages function
var imageObject = $(this);

// somewhere near the bottom
$.fn.browseImages = browseImages; // so that you can use it like 

您在init（）函数中所做的事情并不真正属于您正在制作的插件。您可以将整个init函数直接移动到$（文档）。就绪（…）

更新
main.js的完整代码
(function($) {
    $.fn.browseImages = function(type) {
        var image = [];
        image[3] = "http://farm5.static.flickr.com/4006/5131022085_62876bbfbd_b.jpg";
        image[2] = "http://farm6.static.flickr.com/5201/5289991939_46a20dd9fd_o.jpg";
        image[1] = "http://farm3.static.flickr.com/2127/5807551517_72d39a1d19_b.jpg";

        var imageObject = $(this);
        var selection;

        if (type == "left") {
            for (var i=1; i < Things.length; i++) {
                if (imageObject.attr("src") == Things[i]) {
                    selection = i;
                }
            }
            imageObject.attr("src",image[selection]);
        } else {
            for (var i=1; i < Things.length; i++) {
                if (imageObject.attr("src") == Things[i]) {
                    selection = i;
                }
            }
            imageObject.attr("src",image[selection]);
        };
    }

})(jQuery);

$(function() { // <-- equivalent to $(document).ready(...)
    $("h1").click(function() {
        $('#image').browseImages("left");
    });
});

（函数（$）{
$.fn.browseImages=函数（类型）{
var图像=[]；
图像[3]=”http://farm5.static.flickr.com/4006/5131022085_62876bbfbd_b.jpg";
图像[2]=”http://farm6.static.flickr.com/5201/5289991939_46a20dd9fd_o.jpg";
图像[1]=”http://farm3.static.flickr.com/2127/5807551517_72d39a1d19_b.jpg";
var-imageObject=$（这个）；
var选择；
如果（类型=“左”）{
for（var i=1；i
$（function（）{//是否应该像$.init（）那样调用init函数；您的问题是什么？什么不起作用？顺便说一句，使用许多预先存在的jQuery幻灯片插件中的一个可能会更容易，特别是如果您是初学者，除非您编写此代码是为了了解更多/练习。@nideo-我更像一个PHPguy@RohanVerma，我也是，但是jQuery在web上非常方便。您应该调用init func吗类似于$.init（）；您的问题是什么？什么不起作用？顺便说一句，使用许多预先存在的jQuery幻灯片插件中的一个可能会更容易，特别是如果您是初学者，除非您编写此代码是为了了解更多/练习。@nideo-我更像一个PHPguy@RohanVerma，我也是，但是jQuery在web上非常方便。我不能将它移动到$（document）.ready事件，因为我不想占用index.phpOK中的空间。然后您可以将“jQuery initialization”移动到main.js
（但将其保留在闭包之外）。还可以公开init（）
函数，如$.init=init；
，然后在doc.ready调用$.init（）
你的意思是我应该将这个$（文档）.ready（function（）{init（）}）；
包含在main.js中吗？请查看更新的代码。另外，还不清楚是什么东西，但我希望它们是在其他地方定义的；另外，你的if/else块是相同的-没有意义（正在工作？）。我无法将其移动到$（document）.ready事件，因为我不想占用index.phpOK中的空间。然后您可以将“jQuery initialization”移动到main.js
（但将其保留在闭包之外）。还可以公开init（）
函数，如$.init=init；
，然后在doc.ready调用$.init（）
你的意思是我应该将这个$（文档）.ready（function（）{init（）}）；
包含在main.js中吗？请查看更新的代码。另外，还不清楚是什么，但我希望它们是在其他地方定义的；另外，你的if/else块是相同的-没有意义（正在工作？）我在这里甚至在我的本地主机上上传了你的代码，但它不起作用。你能帮助我吗？我的缓存对象是什么意思？@Rohan:var-imageObject=$（“#image”）；