为什么这个函数不能在一个对象内部工作,但基本上对象外部的相同函数会起作用?

时间:2015-02-26 22:54:10

标签: jquery mustache

我是小胡子的新手并且遇到了一个问题我对他们的原因一无所知。我正在尝试使用Mustache为我的页面注入模板。 问题是我在DOM中抓取和注入模板的函数在一个对象之外工作,但不能在一个对象内部工作。

请任何帮助,以便对这种情况有所启​​发。

有效的代码(对象外):

var portfolio = {
    projects: { 
        "proj": [
            {
                id:"1",
                title:"Heller Recipes",
                description:"This web applications was developed to keep track of my dads recipes and make them easily accesible.He is now able to check each user and make a dinner based on what everybody likes or in some cases dont like.",
                technologiesUsed:"CodeIgniter, PHP, Sequel Pro, Javascript, jQuery,HTML5, CSS3, SASS, Foundation 5.0", 
                projectLink:"http://www.google.com",
                genre:"web-app",
                images: [
                    {largePic:"img/projects/heller-recipes/thumb.jpg",desktopImg:"img/projects/heller-recipes/desktop.png",desktopMobile:"img/projects/heller-recipes/mobile.png"}
                ]
            },
            {
                id:"2",
                title:"3D Animation",
                description:"Created using 4D Cinema Max, a 3d anitmation program that allows you to create realistic renderings and animations.",
                technologiesUsed:"CodeIgniter, PHP, Sequel Pro, Javascript, jQuery,HTML5, CSS3, SASS, Foundation 5.0", 
                projectLink:"http://www.google.com",
                genre:"3d",
                images: [
                    {largePic:"img/projects/4dmax.jpg",desktopImg:"img/projects/heller-recipes/desktop.png",desktopMobile:"img/projects/heller-recipes/mobile.png"}
                ]
            },
        ]
    }
 };
$('body').on('click', '.logo', function(){
    var template = $('#projects_tmp').html();
    var html =  Mustache.to_html(template, { "proj" : portfolio.projects.proj });
    $('.portfolio-wrapper').html(html);
});

不起作用的代码(INSIDE OF OBJECT):

var portfolio = {
    projects: { 
        "proj": [
            {
                id:"1",
                title:"Heller Recipes",
                description:"This web applications was developed to keep track of my dads recipes and make them easily accesible.He is now able to check each user and make a dinner based on what everybody likes or in some cases dont like.",
                technologiesUsed:"CodeIgniter, PHP, Sequel Pro, Javascript, jQuery,HTML5, CSS3, SASS, Foundation 5.0", 
                projectLink:"http://www.google.com",
                genre:"web-app",
                images: [
                    {largePic:"img/projects/heller-recipes/thumb.jpg",desktopImg:"img/projects/heller-recipes/desktop.png",desktopMobile:"img/projects/heller-recipes/mobile.png"}
                ]
            },
            {
                id:"2",
                title:"3D Animation",
                description:"Created using 4D Cinema Max, a 3d anitmation program that allows you to create realistic renderings and animations.",
                technologiesUsed:"CodeIgniter, PHP, Sequel Pro, Javascript, jQuery,HTML5, CSS3, SASS, Foundation 5.0", 
                projectLink:"http://www.google.com",
                genre:"3d",
                images: [
                    {largePic:"img/projects/4dmax.jpg",desktopImg:"img/projects/heller-recipes/desktop.png",desktopMobile:"img/projects/heller-recipes/mobile.png"}
                ]
            },
        ]
    },
    init: function(){
        var template = $('#projects_tmp').html();
        var html =  Mustache.to_html(template, { "proj" : portfolio.projects.proj });
        $('.portfolio-wrapper').html(html);
    }
}
portfolio.init();

0 个答案:

没有答案