我是原型继承概念的新手,我有以下内容:
var dynamicPropertyOverview = new Tab($('#dynamicPropertyOverview'), $('.edit-search'));
dynamicPropertyController.init($('#dynamicPropertyOverview'), $('.edit-search'));
dynamicPropertyOverview.setUpPill();
$(window).resize(dynamicPropertyOverview.setUpPill.bind(dynamicPropertyOverview));
var dynamicPropertyReview = new Tab($('#dynamicPropertyReviews'), $('.edit-search'));
dynamicPropertyController.init($('#dynamicPropertyReviews'), $('.edit-search'));
dynamicPropertyReview.setUpPill();
$(window).resize(dynamicPropertyReview.setUpPill.bind(dynamicPropertyReview));
var dynamicPropertyMap = new Tab($('#dynamicPropertyMap'), $('.edit-search'));
dynamicPropertyController.init($('#dynamicPropertyMap'), $('.edit-search'));
dynamicPropertyMap.setUpPill();
$(window).resize(dynamicPropertyMap.setUpPill.bind(dynamicPropertyMap));
我的原型函数如下:
function Tab(page, pill) {
this.page = page;
this.pill = pill;
}
Tab.prototype.setUpPill = function () {
if(dynamicPropertyController.isDynamicPropertyOverview(this.page) && checkMobileAndTabletVisibility.isTabletView()){
dynamicPropertyController.addSearchModalMobileTrigger();
if(!pillView.isSearchBarNotHidden()){
pillView.hideSearchBarDisplayPill(this.page, this.pill);
}
}
else{
dynamicPropertyController.addSearchBarDesktopTrigger();
}
};
我遇到的问题是每次调用一个新实例时:
1) var dynamicPropertyOverview = new Tab($('#dynamicPropertyOverview'), $('.edit-search'));
2) var dynamicPropertyReview = new Tab($('#dynamicPropertyReviews'), $('.edit-search'));
3) var dynamicPropertyMap = new Tab($('#dynamicPropertyMap'), $('.edit-search'));
将始终被下一个覆盖。
我认为解决这个问题的一种方法是将每个实例包装在if语句中:
if($('#dynamicPropertyReviews').length){
var dynamicPropertyReview = new Tab($('#dynamicPropertyReviews'), $('.edit-search'));
dynamicPropertyController.init($('#dynamicPropertyReviews'), $('.edit-search'));
dynamicPropertyReview.setUpPill();
$(window).resize(dynamicPropertyReview.setUpPill.bind(dynamicPropertyReview));
}
虽然它有效但我想了解是否有更好的方法来解决这个问题。
添加了动态专家控制器:
var dynamicPropertyController = (function() {
var searchBarModalTrigger = 'js-open-mobile-search';
function isDynamicPropertyOverview(page){
return page.length;
}
function addSearchModalMobileTrigger(){
$('.edit-search').removeClass('display-searchBar').addClass(searchBarModalTrigger);
}
function addSearchBarDesktopTrigger(){
$('.edit-search').removeClass(searchBarModalTrigger).addClass('display-searchBar');
}
function init(page, pill){
if(page.length){
pillView.hideSearchBarDisplayPill(page, pill);
}
}
return {
isDynamicPropertyOverview: isDynamicPropertyOverview,
addSearchModalMobileTrigger: addSearchModalMobileTrigger,
addSearchBarDesktopTrigger: addSearchBarDesktopTrigger,
init: init
}
})();