浏览backbone.js视图的基础教程.
预期的行为是在单击#sayhello按钮时调用render函数.渲染只是使用jQuery的html方法将“hello Bud Abbot”放入el中.
但是当我点击#sayhello按钮时,没有任何反应.没有错误或任何东西.我在firebug中设置了一个断点,并观察它只是跳过渲染功能.
这是js:
App = (function($){ jQueryView = Backbone.View.extend({ initialize: function(){ this.el = $(this.el); } }); HelloWorldView = jQueryView.extend({ el: $('#helloworld'),events:{ 'click #sayhello': 'render' },initialize: function(params){ jQueryView.prototype.initialize.call(this); this.name = params.name; },render: function(){ console.log("rendering"); this.el.html("hello " + this.name); } }); var self = {}; self.start = function(){ new HelloWorldView({name: 'Bud Abbot'}); }; return self; });
这是html:
<div id="helloworld"></div> <button id="sayhello">Say Hello</button> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> <script src="http://ajax.cdnjs.com/ajax/libs/underscore.js/1.1.4/underscore-min.js"></script> <script src="http://ajax.cdnjs.com/ajax/libs/backbone.js/0.3.3/backbone-min.js"></script>
当我改变这个时,看起来很奇怪:
new HelloWorldView({name: 'Bud Abbot'});
对此:
new HelloWorldView({name: 'Bud Abbot'}).render();
解决方法
这是因为#sayhello不是你观点的一部分.尝试将#sayhello放在#helloworld中:
<div id="helloworld"> <button id="sayhello">Say Hello</button> </div>
原文地址:https://www.jb51.cc/jquery/176518.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。