Проблемы с преобразованием скрипта jQuery в плагин

Question

Я пытаюсь преобразовать довольно простой скрипт, который берет результаты поиска из Twitter и выводит их в неупорядоченный список.Я впервые пытаюсь написать плагин, и кажется, что он не запускает весь код, когда я его называю.Скрипт сам по себе работает нормально, вот код, который я написал для плагина:

(function($) {

    $.fn.tweetGet = function(options) {

        var defaults = {

            query: 'from:twitter&rpp=10',
            url: 'http://search.twitter.com/search.json?callback=?&q='
        };

        var options = $.extend(defaults, options);

        return this.each(function() {

            // Get tweets from user query
            $.getJSON(options.url + options.query, function(data) {

                var tweets = [];

                $.each(data.results, function(i, tweet) {

                    tweets.push('<li>' + tweet.text.parseURL().parseUsername().parseHashtag() + '</li>');
                });

                $('#target').append('<ul>' + tweets.join('') + '</ul>');
            });

            // Parse tweets for URLs and convert to links
            String.prototype.parseURL = function() {
                return this.replace(/[A-Za-z]+:\/\/[A-Za-z0-9-_]+\.[A-Za-z0-9-_:%&~\?\/.=]+/g, function(url) {
                    return url.link(url);
                });
            };

            // Parse tweets for twitter usernames and convert to links
            String.prototype.parseUsername = function() {
                return this.replace(/(?:^|\s)@[a-zA-Z0-9_.-]+\b/, function(user) {
                    var username = user.replace("@","")
                    return user.link("http://twitter.com/"+username);
                });
            };

            // Parse tweets for hashtags and convert to links
            String.prototype.parseHashtag = function() {
                return this.replace(/[#]+[A-Za-z0-9-_]+/g, function(hash) {
                    var hashtag = hash.replace("#","%23")
                    return hash.link("http://search.twitter.com/search?q="+hashtag);
                });
            };
        });
    };
})(jQuery);

Функция вызывается с помощью:

$('#target').tweetGet({query: 'from:twitter&rpp:10'});

Все, что находится за пределами returnthis.each (function () {}; работает нормально, но ничего внутри не срабатывает и не дает никаких ошибок. Все учебники, которые я прочитал, используют этот же базовый формат, но я не могувыяснить, что я делаю не так ...

Answer 1

Вот рабочая версия: http://jsfiddle.net/JAAulde/QK35D/3/

( function( global )
{
    var String, $;

    if( global.jQuery )
    {
        String = global.String;
        $ = window.jQuery;

        String.prototype = $.extend( String.prototype, {
            // Parse tweets for URLs and convert to links
            parseURL: function()
            {
                return this.replace( /[A-Za-z]+:\/\/[A-Za-z0-9-_]+\.[A-Za-z0-9-_:%&~\?\/.=]+/g, function( url )
                {
                    return url.link( url );
                } );
            },
            // Parse tweets for twitter usernames and convert to links
            parseUsername: function()
            {
                return this.replace( /@[a-zA-Z0-9_.-]+\b/g, function( user )
                {
                    return user.link( 'http://twitter.com/' + user.replace( '@', '' ) );
                } );
            },
            // Parse tweets for hashtags and convert to links
            parseHashtag: function()
            {
                return this.replace( /[#]+[A-Za-z0-9-_]+/g, function( hash )
                {
                    return hash.link( 'http://search.twitter.com/search?q=' + hash.replace( '#', '%23' ) );
                } );
            }
        } );

        $.fn.tweetGet = function( options )
        {
            var defaults = {
                query: 'from:twitter&rpp=10',
                url: 'http://search.twitter.com/search.json?callback=?&q='
            };

            options = $.extend( defaults, options );

            return this.each( function()
            {
                var target = this;
                // Get tweets from user query
                $.getJSON( options.url + options.query, function( data )
                {
                    var tweets = [];

                    $.each( data.results, function( i, tweet )
                    {
                        tweets.push( '<li>' + tweet.text.parseURL().parseUsername().parseHashtag() + '</li>' );
                    } );

                    $( target ).append( '<ul>' + tweets.join('') + '</ul>' );
                } );
            } );
        };
    }
}( window ) );

Смотрите этот ответ на обновления, пока я объясняю мои модификации.

Правки:

1. удалил все модификации прототипа строки из плагина - их не должно быть, поскольку они не являются частью кода плагина, и они будут переопределяться при каждом вызове плагина.
2. удалил селектор #target из плагина, так как он был специально нацелен на элемент, а не использовал коллекцию, для которой был вызван плагин (с учетом области действия из-за обратного вызова getJSON).
3. удалил varобъявление перед options = $.extend( defaults, options );, поскольку оно было ненужным, и существовал риск уничтожения того, что было передано плагину во время исполнения.
4. в качестве отладки, исправила вашу функцию parseUsername, чтобы прекратить добавлять пробел вперед именами пользователей в URL-адресах
5. используется мой предпочтительный синтаксис для локализации кода