Question

我有一个我添加的Javascript文件。它是一个Twitter插件，我添加了一个过滤功能。

这是我的脚本（相关部分）：

;(function ( $, window, document, undefined ) {

    var pluginName = "twitterFeed",
        defaults = {
            username: null,
            webservice_url: "/services/Scope/Country_United_States_Internet/TwitterService.svc/DoTwitterSearch",
            num_tweets: 3
        };    

    // The actual plugin constructor
    function Plugin( element, options ) {
        this.element = element;

        this.options = $.extend( {}, defaults, options );

        this._defaults = defaults;
        this._name = pluginName;

        this.init();
    }

    Plugin.prototype = {

        init: function() {
        //if username is unknown 
            if(this.options.username == null) {
                // do nothing
                try{console.log('twitter username not found')}catch(err){};
                return false;
            }
            // Get the tweets to display
            this.getTweets();

            $(".twitter-search input").on("change", function () {
                var filters = this.formatFilters($(this).val());
                this.getTweets(filters);
            });
        },

        formatFilters : function(filterString) {
            var hashtags = filterString.split(" ");
            var hashtagString = "";
            for (var i = 0; i < hashtags.length; i++) {
                var hashtag = hashtags[i];
                hashtag = hashtag.replace(",", "");
                if (hashtag[0] !== "#") {
                    hashtag = "#" + hashtag;
                }
                hashtagString += " " + hashtag;
            }
            return hashtagString;
        },

        getTweets : function(filters){
            var self = this;
            var query = "from:" + self.options.username;
            if (filters) {
                query += filters;
            }
            var post_data = JSON.stringify(
                {
                    "PageSize" : self.options.num_tweets,
                    "TwitterQuery" : query
                }
            );
            $.ajax({
                type: "POST",  // Change to POST for development environment
                url: this.options.webservice_url,
                data: post_data,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                timeout:2000,
                success: function(data) { 
                    // render the tweets
                    self.renderTweets(data.ContentItems);
                },
                error: function(error, type){
                    try{console.log(type);}catch(err){}
                }
            });
        },

我在更改事件（$(".twitter-search input")）中添加了init，并添加了formatFilters()功能。但是，在onchange函数中，我得到错误＆＃34; this.formatFilters（）未定义＆＃34;。我尝试删除了this，但仍然得到了＆＃34; formatFilters（）未定义。

Answer 1

请记住，事件处理程序中的this表示事件被激活的任何HTML元素。

相反，您需要跟踪实际的Plugin对象，而不是HTML元素。

var self = this;
$(".twitter-search input").on("change", function () {
    var filters = self.formatFilters($(this).val());
    self.getTweets(filters);
});

Answer 2

您遇到的问题是功能范围。当您在事件处理程序中引用它时，它指向回调范围而不是 formatFilters 函数的范围。

要解决此问题 - 在init功能中添加第一行的var self = this;，然后将呼叫更改为使用self.formatFilters代替this.formatFilters

在onclick事件中，Javascript无法识别self.function

2 个答案: