Backbone.js：僅記錄視圖實例返回el屬性

我有一個按鈕和一個窗體。最初，當AddMenuForm視圖初始化時，表單隱藏。Backbone.js：僅記錄視圖實例返回el屬性

我註冊了一個AddMenuButton事件，這樣當點擊按鈕時它將取消隱藏表單。

但是代碼addMenuForm。$ el.show（）不起作用。當我嘗試控制檯記錄addMenuForm時，我得到了addMenuForm的el屬性，而不是addMenuForm實例。

new App; 
var App = Backbone.View.extend({ 
    initialize: function() { 
     var addMenuButton = new AddMenuButton; 
     var addMenuForm = new AddMenuForm; 
    } 
}); 

var AddMenuButton = Backbone.View.extend({ 
    el: '#addMenuButton', 

    events: { 
     'click': 'click' 
    }, 

    click: function(e) { 
     e.preventDefault(); 
     console.log(addMenuForm); 
     addMenuForm.$el.show(); 
    } 
}); 

var AddMenuForm = Backbone.View.extend({ 
    el: '#addMenuForm', 

    initialize: function() { 
     this.$el.hide(); // hide the form 
    } 
})

來源

2013-06-24 Chris Breslaw

我認爲，在javascript中使用'var'不可靠的方式 –

我做了這樣的事情，它工作正常

<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>Backbone.js</title> 
    <script src="jquery-1.8.1.min.js"></script> 
    <script src="underscore.js"></script> 
    <script src="backbone.js"></script> 

</head> 

<body> 
<div class="demo"> 
<form method ="get" id="addMenuForm" > 
<input type="text" value="test"/> 
<input type="button" name="button" value="Check it out!" /> 
</form> 
<input type="button" name="button" value="show form" id="addMenuButton" /> 
</div> 
<script> 

var App = Backbone.View.extend({ 
    el : "demo", 
    initialize: function() { 
     addMenuForm = new AddMenuForm(); 
     addMenuButton = new AddMenuButton({addMenuForm: addMenuForm}); 

    } 
}); 

var AddMenuButton = Backbone.View.extend({ 
    el : '#addMenuButton', 

    initialize: function(options) { 
     this.addMenuForm = options.addMenuForm; 
    }, 

    events: { 
     'click': 'click' 
    }, 

    click: function(e) { 
     e.preventDefault(); 
     console.log(addMenuForm); 
     addMenuForm.$el.show(); 
    } 
}); 

var AddMenuForm = Backbone.View.extend({ 
    el : '#addMenuForm', 

    initialize: function() { 
     this.$el.hide(); // hide the form 
    } 
}); 
var myApp = new App(); 

</script> 


</body> 
</html>

來源

2013-06-24 11:05:03

我假設？是一個錯字。無論如何，我試過你的代碼，但現在甚至沒有註冊我的點擊事件。 –

什麼顯示'console.log（addMenuForm）;'？ –

？意味着如果（選項）比......' –

這裏的問題是範圍。您的AddMenuButton類不知道addMenuForm實例，因爲此實例是在初始化方法App中創建的。

你可以例如拿出addMenuForm的實例，並在AddMenuButton的初始化方法中執行此操作。

var AddMenuButton = Backbone.View.extend({ 
    el: '#addMenuButton', 

    initialize: function() { 
     this.addMenuForm = new AddMenuForm 
    }, 

    events: { 
     'click': 'click' 
    }, 

    click: function(e) { 
     e.preventDefault(); 
     console.log(this.addMenuForm); 
     this.addMenuForm.$el.show(); 
    } 
});

我沒有嘗試它，但它應該這樣工作。

來源

2013-06-24 12:12:10 tmaximini

Backbone.js：僅記錄視圖實例返回el屬性

回答

相關問題