Модуль Singleton и импорт глобального объекта jQuery - PullRequest
Новая
       8

Модуль Singleton и импорт глобального объекта jQuery

4 голосов
/ 14 октября 2011

В попытке улучшить способ кодирования я читал о модуле Singleton.Что я думаю, я полностью понял, однако я видел пример, который импортирует jquery как глобальный, однако я не смог сослаться на элемент DOM, как показано ниже: 

var bnTalent = (function ($) {
    var bnt = {},
        privateVariable = 1;
    domRef = $("#pie").val();

    function privateMethod() {
        // ...
    }

    bnt.moduleProperty = 1;
    bnt.init = function () {
        alert("bingo" + domRef);
        //domRef.hide();
    };

    return bnt;
}(jQuery));

HTML: 

    <!DOCTYPE html>
<html>
<head>
<title>bnTalent</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script src="js/bnTalent.js"></script>

<link rel="stylesheet" href="css/main.css" type="text/css" media="screen" />
</head>

<body>

<input type="text" id="pie" value="mypies" />
</body>

</html>

Пожалуйста, помните, что этот код - только я, играющий вокруг, чтобы получить понимание, но удивляюсь, почему я не могу получить значение элемента DOM из замыкания.Я пропустил суть или допустил ошибку в школьной точке?Обратите внимание, что элемент существует в DOM, и jQuery загружается перед этим модулем.Также это не попытка создания плагина jQuery.

Любая помощь будет принята с благодарностью.

Обратите внимание, что я просто использую firebug для освобождения метода init после загрузки dom.

** ПОЛУЧИЛ ЭТО РАБОТАЕТ - Привет! Я добавил var перед глобальным var domRef, и это, похоже, решило проблему - кто-нибудь может объяснить почему?Также казалось, что я могу использовать domRef без объявления var, однако переменная выше должна быть «1», мы живем и учимся lol

Ответы [ 2 ]

1 голос
/ 14 октября 2011 
function bnTalentFactory($){
    if(bnTalentFactory.bnt)
        return bnTalentFactory.bnt;
    if(arguments.length == 0 || arguments[0] != jQuery)
        var $ = jQuery;
    var bnt = {},
        privateVariable = 1,
        domRef;

    function privateMethod() {
        // ...
    }

    bnt.jqueryIsDefined = function(){
        return $ === jQuery;
    }
    bnt.moduleProperty = 1;
    bnt.init = function () {
        domRef = $("#pie").val();
        alert("bingo" + domRef);
        //domRef.hide();
    };
    bnTalentFactory.bnt = bnt;
    return bnt;
}

var bnTalent = bnTalentFactory();
var anotherBnTalent = bnTalentFactory();
alert(bnTalent === anotherBnTalent);// true => the same instance
alert(bnTalent.jqueryIsDefined());// true => jquery is defined inside this object, withouth even passing it to the factory

Обратите внимание, что для того, чтобы иметь действительный "domRef", вам необходимо выполнить этот код после загрузки dom, чтобы во время выполнения существовало $("#pie").

1 голос
/ 14 октября 2011

Это работает: http://jsfiddle.net/J9PKB/ что именно вы не можете сделать?

Редактировать

Вы не используете метод initгде-нибудь ..., вы надеетесь, что он получит звонок автоматически?Потому что это не так.Вы должны назвать это сами.

Добавьте это на свой тег головы, после включения ваших файлов JS: 

<script type="text/javascript">
  $(document).ready(function() {  bnTalent.init(); } );
</script>

Дайте мне знать, если это поможет!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...