从名称空间调用要在另一个javascript文件中使用的方法

Calling a method from a namespace to use in another javascript file

本文关键字：文件 方法 javascript 另一个 空间 调用      更新时间：2023-09-26

为了组织我的代码，我碰巧为我的主javascript文件写了一个命名空间。然后我想把那个文件的一些函数调用到我的自定义javascript文件中，比如script.js。问题是我无法访问名称空间的方法。下面是我的示例代码:

main.js 

$( function() {
    "use strict"
     var Accordian = {
     slide : function() {
         $('h3').click( function() {
             $(this).next('div').slideToggle('1000');
             $(this).toggleClass('toggled');
         });
    },
    slideEaseOutBounce: function() {
         $('h3').click( function() {
              $(this).next().animate(
                  {'height' : 'toggle'}, 1000, 'easeOutBounce'
               );
               $(this).toggleClass('toggled');
         });
    },
    slideEaseInOutExpo: function() {
         $('h3').click( function() {
             $(this).next().animate(
                  {'height' : 'toggle'}, 1000, 'easeInOutExpo'
             );
             $(this).toggleClass('toggled');
         });
    }
});

和我已经尝试了如下script.js

$(document).ready( function() {
    Accordian.slide();
});

更新:

链接如下:http://jsnamespace.comyr.com/using-accordian.html

错误信息出现"ReferenceError: Accordian is not defined"

注:script.js中缺少分号line 63

由于修改您的网站使用此代码工作:

<script type="text/javascript">
    $(document).ready( function() {
        Accordian[0].slide();
    });
</script>

小提琴演示

似乎将"Accoridian"包装在jQuery函数中需要将其作为子元素解引用。

当你在script.js的line 1处移除$时

var Accordian = $(function () {

到

var Accordian = (function () {

(如@匿名建议)，它与您的原始调用Accordian.slide()。

首先你必须创建一个唯一的根命名空间，像这样:

window.Accordian = window.Accordian || {};

这部分必须在所有下一步之上完成!它可以在html页头的脚本标签中完成。

之后，你可以使用你的对象:

//creating a function :
Accordian.slide = function() {
     $('h3').click( function() {
         $(this).next('div').slideToggle('1000');
         $(this).toggleClass('toggled');
     });
}
//and later using it :
Accordian.slide()

这是最简单的方法!

您喜欢使用多个文件，所以让我们试试:

mains.js 

/*$*/( function(globalAccordian) {
    "use strict"
     /* var Accordian = { */
     globalAccordian = {
     // doing like this will override your globalAccordian
     // if it was already generated by another script
     slide : function() {
         $('h3').click( function() {
             $(this).next('div').slideToggle('1000');
             $(this).toggleClass('toggled');
         });
    },
    slideEaseOutBounce: function() {
         $('h3').click( function() {
              $(this).next().animate(
                  {'height' : 'toggle'}, 1000, 'easeOutBounce'
               );
               $(this).toggleClass('toggled');
         });
    },
    slideEaseInOutExpo: function() {
         $('h3').click( function() {
             $(this).next().animate(
                  {'height' : 'toggle'}, 1000, 'easeInOutExpo'
             );
             $(this).toggleClass('toggled');
         });
    }
})( window.Accordian || {} );

script.js 

$(document).ready( function() {
    Accordian.slide();
})

您不能访问命名空间，因为它被封装在函数中。我建议仔细阅读揭示模块模式。

JSFiddle:http://jsfiddle.net/R927K/

的例子:

    var Accordian = (function() {
     var Accordian = {
     slide : function() {
         alert('sliding');
         }
     };
         return Accordian;
}());
Accordian.slide();

相关文章：