Fatal编程技术网
  • javascript/
  • Javascript API：超出范围的函数

Javascript API：超出范围的函数

javascript jquery

Javascript API：超出范围的函数,javascript,jquery,Javascript,Jquery,我遇到以下错误：未定义SyncNavigationSetCssToState $(function () { var NavigationSetApi = { SyncNavigationSetCssToState: function (navigationSet) { var navigationSetContent = navigationSet.find(".navigation-set-content"); var

我遇到以下错误：未定义SyncNavigationSetCssToState

$(function () {
    var NavigationSetApi = {
        SyncNavigationSetCssToState: function (navigationSet) {
            var navigationSetContent = navigationSet.find(".navigation-set-content");
            var navigationSetHeaderButton = navigationSet.find(".navigation-set-header-button");

            if (navigationSetContent.is(":visible"))
                navigationSetHeaderButton.removeClass("closed").addClass("open");
            else
                navigationSetHeaderButton.removeClass("open").addClass("closed");
        },

        GetAllNavigationSets: function () {
            return $(".navigation-set");
        },

        SyncAllNavigationSetCssToState: function () {
            this.GetAllNavigationSets().each(function () {
                SyncNavigationSetCssToState($(this));
            });
        }
    }

    NavigationSetApi.SyncAllNavigationSetCssToState();
}
我无法确定如何从SyncNavigationSetCssToState中的each（）函数中访问SyncNavigationSetCssToState。我如何从这里引用主api对象？调用SyncNavigationSetCssToState时，您正在引用此

$(function () {
    var NavigationSetApi = {
        SyncNavigationSetCssToState: function (navigationSet) {
            var navigationSetContent = navigationSet.find(".navigation-set-content");
            var navigationSetHeaderButton = navigationSet.find(".navigation-set-header-button");

            if (navigationSetContent.is(":visible"))
                navigationSetHeaderButton.removeClass("closed").addClass("open");
            else
                navigationSetHeaderButton.removeClass("open").addClass("closed");
        },

        GetAllNavigationSets: function () {
            return $(".navigation-set");
        },

        SyncAllNavigationSetCssToState: function () {
            this.GetAllNavigationSets().each(function () {
                NavigationSetApi.SyncNavigationSetCssToState($(this));
            });
        }
    }

    NavigationSetApi.SyncAllNavigationSetCssToState();
}
用
NavigationSetApi.SyncNavigationSetCssToState

$(function () {
    var NavigationSetApi = {
        SyncNavigationSetCssToState: function (navigationSet) {
            var navigationSetContent = navigationSet.find(".navigation-set-content");
            var navigationSetHeaderButton = navigationSet.find(".navigation-set-header-button");

            if (navigationSetContent.is(":visible"))
                navigationSetHeaderButton.removeClass("closed").addClass("open");
            else
                navigationSetHeaderButton.removeClass("open").addClass("closed");
        },

        GetAllNavigationSets: function () {
            return $(".navigation-set");
        },

        SyncAllNavigationSetCssToState: function () {
            this.GetAllNavigationSets().each(function () {
                NavigationSetApi.SyncNavigationSetCssToState($(this));
            });
        }
    }

    NavigationSetApi.SyncAllNavigationSetCssToState();
}
正在扩展有关实例的评论

上面只是一个简单的Javascript对象
此
引用对象
NavigationSetApi
，以保持其简单性。但是当您调用
this.GetAllNavigationSets（）.each
，
each
现在通过使用设置
this

如果要使用
NavigationSetApi
作为实例，首先需要将其设置为函数（如果您知道任何OO语言，请考虑类）

这是您将如何定义它的：

function NavigationSetApi(){

}

NavigationSetApi.prototype = {
    SyncNavigationSetCssToState: function (navigationSet) {
        var navigationSetContent = navigationSet.find(".navigation-set-content");
        var navigationSetHeaderButton = navigationSet.find(".navigation-set-header-button");

        if (navigationSetContent.is(":visible"))
            navigationSetHeaderButton.removeClass("closed").addClass("open");
        else
            navigationSetHeaderButton.removeClass("open").addClass("closed");
    },

    GetAllNavigationSets: function () {
        return $(".navigation-set");
    },

    SyncAllNavigationSetCssToState: function () {
        //From Blake Simpson's answer
        var api = this;
        this.GetAllNavigationSets().each(function () {
            api.SyncNavigationSetCssToState($(this));
        });
    }
};
然后你会用

var instanceApi = new NavigationSetApi();
instanceApi.SyncAllNavigationSetCssToState();
在这种情况下，您正在设置对象的原型，当您使用
new

有趣的是，你还可以在大多数东西的原型中添加东西，比如字符串或日期

例如：

String.prototype.logAWord = function(word){
    console.log(word);
};

// "" is an instance of String
// Logs "Hello"
"".logAWord("Hello");
调用
SyncNavigationSetCssToState

$(function () {
    var NavigationSetApi = {
        SyncNavigationSetCssToState: function (navigationSet) {
            var navigationSetContent = navigationSet.find(".navigation-set-content");
            var navigationSetHeaderButton = navigationSet.find(".navigation-set-header-button");

            if (navigationSetContent.is(":visible"))
                navigationSetHeaderButton.removeClass("closed").addClass("open");
            else
                navigationSetHeaderButton.removeClass("open").addClass("closed");
        },

        GetAllNavigationSets: function () {
            return $(".navigation-set");
        },

        SyncAllNavigationSetCssToState: function () {
            this.GetAllNavigationSets().each(function () {
                NavigationSetApi.SyncNavigationSetCssToState($(this));
            });
        }
    }

    NavigationSetApi.SyncAllNavigationSetCssToState();
}
用
NavigationSetApi.SyncNavigationSetCssToState

$(function () {
    var NavigationSetApi = {
        SyncNavigationSetCssToState: function (navigationSet) {
            var navigationSetContent = navigationSet.find(".navigation-set-content");
            var navigationSetHeaderButton = navigationSet.find(".navigation-set-header-button");

            if (navigationSetContent.is(":visible"))
                navigationSetHeaderButton.removeClass("closed").addClass("open");
            else
                navigationSetHeaderButton.removeClass("open").addClass("closed");
        },

        GetAllNavigationSets: function () {
            return $(".navigation-set");
        },

        SyncAllNavigationSetCssToState: function () {
            this.GetAllNavigationSets().each(function () {
                NavigationSetApi.SyncNavigationSetCssToState($(this));
            });
        }
    }

    NavigationSetApi.SyncAllNavigationSetCssToState();
}
正在扩展有关实例的评论

上面只是一个简单的Javascript对象
此
引用对象
NavigationSetApi
，以保持其简单性。但是当您调用
this.GetAllNavigationSets（）.each
，
each
现在通过使用设置
this

如果要使用
NavigationSetApi
作为实例，首先需要将其设置为函数（如果您知道任何OO语言，请考虑类）

这是您将如何定义它的：

function NavigationSetApi(){

}

NavigationSetApi.prototype = {
    SyncNavigationSetCssToState: function (navigationSet) {
        var navigationSetContent = navigationSet.find(".navigation-set-content");
        var navigationSetHeaderButton = navigationSet.find(".navigation-set-header-button");

        if (navigationSetContent.is(":visible"))
            navigationSetHeaderButton.removeClass("closed").addClass("open");
        else
            navigationSetHeaderButton.removeClass("open").addClass("closed");
    },

    GetAllNavigationSets: function () {
        return $(".navigation-set");
    },

    SyncAllNavigationSetCssToState: function () {
        //From Blake Simpson's answer
        var api = this;
        this.GetAllNavigationSets().each(function () {
            api.SyncNavigationSetCssToState($(this));
        });
    }
};
然后你会用

var instanceApi = new NavigationSetApi();
instanceApi.SyncAllNavigationSetCssToState();
在这种情况下，您正在设置对象的原型，当您使用
new

有趣的是，你还可以在大多数东西的原型中添加东西，比如字符串或日期

例如：

String.prototype.logAWord = function(word){
    console.log(word);
};

// "" is an instance of String
// Logs "Hello"
"".logAWord("Hello");
这可以使用
bind
保持
This
的正确状态，并通过参数访问节点：

SyncAllNavigationSetCssToState: function () {
    this.GetAllNavigationSets().each(function (i,node) {
        this.SyncNavigationSetCssToState($(node));
    }.bind(this));
}
但是简单地访问
NavigationSetApi
变量更容易（我相信也更便宜）。

这可以使用
绑定来保持
This
的正确状态，并通过参数访问节点：


SyncAllNavigationSetCssToState: function () {
    this.GetAllNavigationSets().each(function (i,node) {
        this.SyncNavigationSetCssToState($(node));
    }.bind(this));
}



但是简单地访问
NavigationSetApi
变量更容易（我相信也更便宜）。
使用
this
并查看Use
this
并查看他已经有了对包含方法的对象的引用，
NavigationSetApi
Fair point，不过，我还是把这个放在这里，看看其他的方法。这也是我的第一个想法：P。但是
这个
只是
导航SETAPI
总之，是的，你的方法是最简单的，所以它应该是答案。实际上，我将编辑我的答案以删除第一种方法，因为这通常被认为是一种黑客行为！他已经提到了包含该方法的对象，
NavigationSetApi
Fair point，我将把这个放在这里，不过为了看一下其他的方法。这也是我的第一个想法：P。但是
这个
只是
NavigationSetApi
无论如何是的，你的方法是最简单的，所以它应该是答案。实际上，我将编辑我的答案以删除第一种方法，因为这通常被认为是一种黑客行为！谢谢但它如何知道我希望它使用的NavigationSetApi的哪个实例呢？因为只有一个实例，它只是一个对象，其中包含一些您正在使用的函数。“
static
”差不多。一秒钟内实例之间的差异示例。为额外信息干杯。这正是我感到困惑的地方。非常感谢，谢谢！但它如何知道我希望它使用的NavigationSetApi的哪个实例呢？因为只有一个实例，它只是一个对象，其中包含一些您正在使用的函数。“
static
”差不多。一秒钟内实例之间的差异示例。为额外信息干杯。这正是我感到困惑的地方。非常感谢。