Question

我有以下内容适用于一个页面，但我想让它可用于另外两页：

 var dynamicPropertyOverviewController = (function(){

    var currentPage = $('#dynamicPropertyOverview');

    function init(){
        if(checkMobileAndTabletVisibility.isTabletView()){
            if(dynamicPropertyController.isDynamicPropertyOverviewWithAvailability(currentPage)){
                dynamicPropertyController.addSearchModalMobileTrigger();
                if(dynamicPropertyController.isSearchBarNotHidden()){
                    dynamicPropertyController.hideSearchBarDisplayPill(currentPage);
                }
            }
        }
        else{
            dynamicPropertyController.addSearchBarDesktopTrigger();
        }
    }

    return{
        init: init
    }

})();

“currentPage”var将确定此init的应用位置。

这只是为了更好地了解所有这些功能的来源：

    var dynamicPropertyController = (function() {

        var searchBarModalTrigger = 'js-open-mobile-search';

        function isDynamicPropertyOverviewWithAvailability(page){
            return page.length && !$('.property-not-available').length;
        }

        function hideSearchBarDisplayPill(page){
            page.addClass('hide-search-form');
        $('.check-prices').addClass('display-pill');    
    }

    function addSearchModalMobileTrigger(){
        $('.edit-search-link').removeClass('display-searchBar').addClass(searchBarModalTrigger);
    }

我该如何制作

    function addSearchBarDesktopTrigger(){
        $('.edit-search-link').removeClass(searchBarModalTrigger).addClass('display-searchBar');
    }

    function isSearchBarNotHidden(){
        return !$('.hide-search-form').length;
    }

    return {
        isDynamicPropertyOverviewWithAvailability: isDynamicPropertyOverviewWithAvailability,
        hideSearchBarDisplayPill: hideSearchBarDisplayPill,
        addSearchModalMobileTrigger: addSearchModalMobileTrigger,
        addSearchBarDesktopTrigger: addSearchBarDesktopTrigger,
        isSearchBarNotHidden: isSearchBarNotHidden
    }

})();

如何制作“dynamicPropertyOverviewController”以便我可以传递一个变量并在3个不同的页面中使用它？

Answer 1

以下模式允许您使用公开不同模块的var：

window.App = {};
window.App.sharedVariable = "Same value";
(function (App) {
    console.log("I can read App.sharedVariable", App.sharedVariable);

}(window.App));

(function (App) {
    console.log("I can read App.sharedVariable too!", App.sharedVariable);
}(window.App));

(function (App) {
    App.sharedVariable = "Changed the value!"
}(window.App));

(function (App) {
  console.log("he did changed App.sharedVariable", App.sharedVariable);
   console.log("you can even have custom event listeners and trigger it when the variable is changed and stuff, neat hun ?");
}(window.App));

我保持它非常基本和简单，以便您可以在任何地方应用这些知识！这可能很有用，你不需要太多去理解它，并且非常适合你当前的问题！

您可以在此处找到一个有效的示例：http://codepen.io/anon/pen/JXPOZg?editors=1111

Answer 2

我找到了一些对我有用的东西：

function CarPartFactory() {}
CarPartFactory.prototype.createPart = function createCarPart( options ) {
  console.log(options + ' options');
}

var seat = new CarPartFactory();

// outputs a CarSeat object with material "leather", color "blue", isReclinable "false"
seat.createPart('page');

像这样，我可以传递任何我喜欢的页面

揭示模块模式模板

2 个答案: