オブジェクトが正しく更新されない

Question

私はjQuery/JavaScriptを使用してウェブサイトを作成しています。問題は、aMenuのインスタンスを複数作成すると、別々のファイルで作成したオブジェクトです。独自の変数であるにもかかわらず、各オブジェクトの情報

私はaMenuは、オブジェクトを作成するJavaScript：

// Drawer item, animates via CSS - no need to animate using jQuery 
var drawerOptions = { 
    animate: false, 
    toggle_element: '#parent', 
    toggle_attribute: 'data-opened', 
    default_toggled: false, 
    toggle_after_animation: false 
} 
var Drawer = new aMenu(drawerOptions); 

// LargeDrawer item 
var largeDrawerOptions = { 
    animate: false, 
    toggle_element: '#parent', 
    toggle_attribute: 'data-opened', 
    default_toggled: false, 
    toggle_after_animation: false 
} 
var LargeDrawer = new aMenu(largeDrawerOptions); 

// Search item 
var searchbarOptions = { 
    animate: true, 
    toggle_element: '.search_nav_drop', 
    toggle_attribute: 'data-opened', 
    default_toggled: false, 
    toggle_after_animation: true, 
    animation: 'slide' 
} 
var NSearchBar = new aMenu(searchbarOptions); 

aMenuオブジェクト：

function aMenu(options){ 

    // Run our init if we have one. 
    this.options.onInit(this); 

    // Intertwine our current default options and whats being passed in. 
    // Same as $.extend 
    this.options = intertwine(this.options, options); 

    // Determine default toggling. 
    this.toggled = this.isToggled(); 
    } 

    // Default options 
    aMenu.prototype.options = { 
    animate: true, // If we are animating this menu 
    animation: 'slide', // Animation types: none|fade|slide|custom 
    speed: 500, // Animation speed 
    easing: 'linear', // Easing into the animation types: linear|swing|_default 
    stop_event: false, // If the stop event is used in this case 
    toggle_element: '', // This element keeps track of being toggled in HTML. Leave blank or 'none' for keeping track in JavaScript 
    toggle_attribute: '', // Attribute that get toggled (true/false). Leave blank if toggle_element is blank or 'none' 
    default_toggled: true, // The default selection if we are toggled or not (only used if no toggle_element) 
    throw_errors: true, // If you want errors to be thrown for problem code. 
    toggle_after_animation: true, // If you want the menu to toggled after the animation is completed. 
    onToggle: function() {return false;}, // Function gets trigger when toggled 
    onInit: function() {return false;}, // Function gets trigger at initialization 
    onHide: function() {return false;}, // Function gets triggered when inactivated 
    onShow: function() {return false;}, // Function gets triggered when activated 
    onShowAnimationCompleted: function() {return false;}, // Function gets triggered after animation completes on show 
    onHideAnimationCompleted: function() {return false;} // Function get trigger after animation completes on hide 
    } 

だけを指定するには、オブジェクトの引き出しがNSearchBarとして渡さ同じオプションを持つことになりますが引き出しは完全に壊れます。

これが試作で問題になるかどうかは不明ですし、まったく見当たりません。どんな助けも可能です、ありがとう！

Answer 1

this.optionsは、最初にターゲットを拡張して返信する（それが$.extendと同じである場合）aMenu.prototype.options

にintertwineをreferes：

対象オブジェクト（最初の引数）があろうことに留意してください変更され、$ .extend（）からも返されます。

したがってthis.optionsは、aMenuのすべてのインスタンスで同じです。

あなたは記述する必要があります。

this.options = $.extend({}, this.options, options) 

このコピーし、最初は新しいopjectにaMenu.prototype.optionsを参照して、コピーoptionsの性質をしてthis.optionsに割り当てられた新しいオブジェクトを返しますthis.optionsの性質。

intertwineと同じように機能する場合は、実装方法によって異なります。