我已经编写了以下脚本来动态更新值而不刷新，脚本没问题，但 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>
最佳答案
您似乎忘记将 View 添加到您的 html 页面。您的脚本中需要这样一行:
$('body').append(songView.render().el);
您可以使用您想要的任何其他元素来代替“body”。
还有一件事:歌曲 View 中的“初始化”一词有错别字。因此， View 中的监听器不会对更改使用react。
关于javascript - 在 Backbone Js 中处理模型事件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27654261/