如果我从外部文件调用它，我的代码将无效

Question

我有这段代码：

var list_template, albums_template, photos_template, animal_template;
var current_album = animals_data.category[0];
var current_photo = current_album.animals[0];

function showTemplate(template, data, area){
var html    = template(data);
$(area).html(html);
};

$(document).ready(function(){
var source = $("#list-template").html();
list_template = Handlebars.compile(source);

source = $("#albums-template").html();
albums_template = Handlebars.compile(source);

source = $("#photos-template").html();
photos_template = Handlebars.compile(source); 

source = $("#photo-template").html();
animal_template = Handlebars.compile(source);

    function photoClick() {
    var index = $(this).data("id");
        console.log(index);
        current_photo = current_album.animals[index];

        $(".nav-tabs .active").removeClass("active");
        $("#photos").addClass("active");

        showTemplate(animal_template,current_photo,"#content");

};
function albumClick() {
        var index = $(this).data("id");
        current_album = animals_data.category[index];

        $(".nav-tabs .active").removeClass("active");
        $("#albums").addClass("active");

        showTemplate(photos_template,current_album,"#content");

    $('.photo-thumbnail').on("click", photoClick);

    };  

    $('#home').click(function() {
        showTemplate(albums_template,animals_data,"#content");

        $(".nav-tabs .active").removeClass("active");
        $("#home").addClass("active");

        $('.album-thumbnail').on("click",albumClick);
});

$('#classList li').on("click",albumClick);

$('#home').click();
showTemplate(list_template,animals_data,"#list");
});

来自外部文件源。每当我加载我的HTML文件时，只有

showTemplate(list_template,animals_data,"#list");

的工作原理。但是，如果我转移这部分代码：

$(document).ready(function(){
    function photoClick() {
    var index = $(this).data("id");
        console.log(index);
        current_photo = current_album.animals[index];

        $(".nav-tabs .active").removeClass("active");
        $("#photos").addClass("active");

        showTemplate(animal_template,current_photo,"#content");

};
function albumClick() {
        var index = $(this).data("id");
        current_album = animals_data.category[index];

        $(".nav-tabs .active").removeClass("active");
        $("#albums").addClass("active");

        showTemplate(photos_template,current_album,"#content");

    $('.photo-thumbnail').on("click", photoClick);

    };  

    $('#home').click(function() {
        showTemplate(albums_template,animals_data,"#content");

        $(".nav-tabs .active").removeClass("active");
        $("#home").addClass("active");

        $('.album-thumbnail').on("click",albumClick);
});

$('#classList li').on("click",albumClick);

$('#home').click();

进入我的HTML文件，它可以完美加载。我想知道导致此错误的原因以及如何解决此错误。谢谢你的回答。