Question

我正在创建一个BackboneJS项目。它在Chrome和Safari中运行良好，但在Firefox中，我收到错误，导致我的应用无法加载，我无法解决原因。

错误出现在我的jQuery文件中，但显然我的应用程序中有一个触发它，因为jQuery库本身就很好。

在jQuery“createSafeFragment”方法的第二行抛出错误：

function createSafeFragment( document ) {
    var list = nodeNames.split( "|" ),
        safeFrag = document.createDocumentFragment();

    if ( safeFrag.createElement ) {
        while ( list.length ) {
            safeFrag.createElement(
                list.pop()
            );
        }
    }
    return safeFrag;
}

运行应用程序的我的main.js：

Backbone.View.prototype.close = function () {
    if (this.beforeClose) {
        this.beforeClose();
    }
    this.remove();
    this.unbind();
};

var AppRouter = Backbone.Router.extend({

    routes: {
        '': 'home',
        'login' : 'login',
        'register' : 'register',
        'rosters' : 'rosters',
        'workplaces' : 'workplaces',
        'groups' : 'groups',
        'shifts' : 'shifts',
        'logout' : 'logout'
    },

    content : '#content',

    initialize: function () {
        window.headerView = new HeaderView();
        $('.header').html(window.headerView.render().el);
    },

    home: function () {
        window.homePage = window.homePage ? window.homePage : new HomePageView();
        app.showView( content, window.homePage);
        window.headerView.select('home');
    },

    register: function () {
        window.registerPage = window.registerPage ? window.registerPage : new RegisterPageView();
        app.showView( content, window.registerPage);
        window.headerView.select('register');
    },

    login: function() {
        app.showView( content, new LoginPageView());
        window.headerView.select('login');
    },

    rosters: function () {
        if(Utils.checkLoggedIn()){
            app.showView( content, new RosterPageView());
            window.headerView.select('rosters');
        }
    },

    groups: function () {
        if(Utils.checkLoggedIn()){
            app.showView( content, new GroupsPageView());
            window.headerView.select('groups');
        }
    },

    shifts: function () {
        if(Utils.checkLoggedIn()){
            app.showView( content, new ShiftsPageView());
            window.headerView.select('shifts');
        }
    },

    workplaces: function () {
        if(Utils.checkLoggedIn()){
            app.showView( content, new WorkplacesPageView());
            window.headerView.select('workplaces');
        }
    },

    logout: function () {
        window.headerView.toggleLogin(false);
        this.login();
    },

    showView: function(selector, view) {
        if (this.currentView)
            this.currentView.close();
        $(selector).html(view.render().el);
        this.currentView = view;
        return view;
    }

});

Utils.loadTemplates(['HomePageView', 'HeaderView', 'LoginPageView', 'RegisterPageView', 
                     'RostersPageView', 'GroupsPageView', 'ShiftsPageView', 'UserListView', 
                     'GroupListView', 'ShiftListView', 'SearchedUserListView', 'SearchedGroupListView', 
                     'GroupRosterView', 'RosterListView', 'WorkplacesPageView', 'WorkplaceListView',
                     'SearchedWorkplaceListView', 'RosterJoinListView', 'GroupUserListView',
                     'WorkplaceRosterView', 'WorkplaceUserListView', 'RosterShiftView'], function(){
    app = new AppRouter();
    Backbone.history.start();
});

我的Util.js：

Utils = {

    //template stuff
    templates: {},
    loadTemplates: function(names, callback) {

        var that = this;

        var loadTemplate = function(index) {
            var name = names[index];
            $.get('tpl/' + name + '.html', function(data) {
                that.templates[name] = data;
                index++;
                if (index < names.length) {
                    loadTemplate(index);
                } else {
                    callback();
                }
            });
        };

        loadTemplate(0);
    },

    get: function(name) {
        return this.templates[name];
    },

    //error stuff

    showAlertMessage: function(message, type){
        $('#error').html(message);
        $('.alert').addClass(type);
        $('.alert').show();
    },

    showErrors: function(errors) {
        _.each(errors, function (error) {
            var controlGroup = $('.' + error.name);
            controlGroup.addClass('error');
            controlGroup.find('.help-inline').text(error.message);
        }, this);
    },

    hideErrors: function () {
        $('.control-group').removeClass('error');
        $('.help-inline').text('');
    },

    //validator stuff

    validateModel: function(model, attrs){

        Utils.hideErrors();
        var valError = model.validate(attrs);
        if(valError){
            Utils.showErrors(valError);
            return false;
        }
        return true;
    },

    //loading stuff

    toggleLoading: function(toggle){
        $('#loading').css('visibility', toggle ? 'visible' : 'hidden');
    },

    //login stuff

    login: function(auth){

        window.headerView.toggleLogin(true);
        Backbone.history.navigate("", true);
    },

    checkLoggedIn: function(){

        if(!window.userId){
            window.headerView.toggleLogin(false);
            Backbone.history.navigate("login", true);

            return false;
        }
        return true;
    },

    //util methods

    formatDate: function(date){
        var formattedDate = '';
        formattedDate += date.getFullYear() + '-';
        formattedDate += date.getMonth()+1 + '-';
        formattedDate += date.getDate();
        return formattedDate;
    },

    formatDateForDisplay: function(date){
        var formattedDate = '';
        formattedDate += date.getDate() + '/';
        formattedDate += date.getMonth()+1 + '/';
        formattedDate += date.getFullYear() + ' - ';
        formattedDate += ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'][date.getDay()];
        return formattedDate;
    },

    formatDateForGroup: function(date){
        var formattedDate = '';
        formattedDate += date.getDate() + '/';
        formattedDate += date.getMonth()+1;
        return formattedDate;
    },

    showPopup: function(id, buttons, title, content){
        var popup = $(id);
        popup.dialog({
              modal: true,
              title: title,
              buttons: buttons
            }); 
        popup.find('#popupContent').html(content);
    }
};

有人请帮帮我，因为这让我抓狂！仅限Firefox ......

Answer 1

我也遇到了这个问题。您可以通过执行以下操作重现此错误：

$(window).append('bla');

我的结合起因是：

<a href="#" onClick="doIt(); return false;">click</a>

和

function doIt(){
   var newElm = $('<span>hi</span>');
   $(this).append(newElm);
   //now this === window, and not what I was expecting the a-element
}

这一切都发生了，因为我预计点击会以~~正确的~~更多jquery-ish方式绑定到a元素。但有人决定使用1999年代码; p。我希望这个方法能够像这样绑定：

$("a").click(doIt);

在这种情况下这个会绑定到a元素而不是窗口。

Answer 2

benhowdle89发现当我应该追加content时，我正在追加this.content。

总是使用我已经意识到的JSFiddle也是一个好主意，所以其他人可以自己看到你的问题。

感谢benhowdle89！

使用jquery-1.10.2.js“TypeError：document is undefined”

2 个答案: