我编写了以下脚本来动态更新值而不刷新，该脚本可以，但是id在页面中未显示更新的值。但是，在Chrome浏览器的控制台中，它显示属性的更新值，但在页面中则不显示。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Pass Data to Views</title>
</head>
<body>
<!-- ========= -->
<!-- Your HTML -->
<!-- ========= -->
<div id="container"></div>
<!-- ========= -->
<!-- Libraries -->
<!-- =========
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min.js" type="text/javascript"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.2/backbone-min.js" type="text/javascript"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/backbone-localstorage.js/1.0/backbone.localStorage-min.js" type="text/javascript"></script> -->
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/underscore-min.js" type="text/javascript"></script>
<script src="js/backbone-min.js" type="text/javascript"></script>
<script src="js/backbone.localStorage-min.js" type="text/javascript"></script>
<!-- =============== //
<!-- Javascript code -->
<!-- =============== -->
<script type="text/javascript">
// Model
var Song = Backbone.Model.extend({
defaults: {
listeners: 0
}
});
var SongView = Backbone.View.extend({
initilize: function(){
this.model.on("change", this.render,this);
},
render: function(){
this.$el.html(this.model.get("title") + " - Listerners : " + this.model.get("listeners"));
return this;
}
});
var song = new Song({title: "Blue in Green"});
var songView = new SongView({el: "#container", model: song});
songView.render();
</script>
</body>
</html>
最佳答案
您似乎忘记了将视图添加到html页面。您的脚本中需要这样的一行：
$('body').append(songView.render().el);
除了“ body”，您还可以使用任何其他想要的元素。
还有一件事：歌曲视图中的“初始化”一词有错字。因此，视图中的侦听器不会对更改做出反应。
关于javascript - 在Backbone Js中处理模型事件，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/27654261/