Организация страницы функций и состояния страницы с помощью модуля шаблон


Поэтому я разрабатываю веб-страницы с использованием MVC, который будет в основном на JavaScript.

Вместо использования глобальных переменных и глобальных функций, я хотел бы сделать это правильно в этот раз. Я не хочу использовать что-то сложное, потому что команда и я новичок в больших JavaScript-приложений. Я пробовал реализации шаблона модуль, чтобы организовать свои функции и состояние страницы.

Это то, что я придумал до сих пор.

Я злоупотребляя модульные картины? Что я делаю не так? Где у меня будут неприятности?

<script type="text/javascript">
    var ui = (function ($) {
        var _ui = {};

        _ui.submitMainForm = function () {                
            document.main.submit();
        };

        return _ui;
    } (jQuery));

    ui.tabs = (function ($) {
        var _tabs = {};

        var resourceTabs = $("#resourceTabs");
        var selectedTabPersistence = $("#SelectedTab");

        _tabs.getSelectedTab = function () {
            return selectedTabPersistence.val();
        };
        _tabs.setSelectedTab = function (value) {
            selectedTabPersistence.val(value);
        };
        _tabs.initialize = function () {
            resourceTabs.tabs({
                select: function (event, ui) { _tabs.setSelectedTab(ui.tab.hash); }
            });
            resourceTabs.tabs("select", _tabs.getSelectedTab());                
        };

        return _tabs;
    } (jQuery));

    ui.filter = (function ($) {
        var _filter = {};

        var personLevels = $("#personLevels");
        var vehicleLevels = $("#vehicleLevels");
        var personLevelsRadio = $("#personLevels :radio");
        var vehicleLevelsRadio = $("#vehicleLevels :radio");

        _filter.initialize = function () {
            personLevels.buttonset();
            vehicleLevels.buttonset();
            personLevelsRadio.bind("change", function () { ui.submitMainForm() });
            vehicleLevelsRadio.bind("change", function () { ui.submitMainForm() });
        };

        return _filter;
    } (jQuery));


    $(document).ready(function () {
        ui.tabs.initialize();
        ui.filter.initialize();
    });       
</script>


402
4
задан 21 июня 2011 в 06:06 Источник Поделиться
Комментарии
1 ответ

У вас есть несколько анонимных функций, когда вы могли бы сделать один и на последней обратку пользовательский интерфейс.* объект.

var ui = (function($) {
// local ui ref
var ui = {};

// other namespaces .. etc
ui.tabs = {};

return ui;
})(jQuery));

1
ответ дан 21 июня 2011 в 09:06 Источник Поделиться