BackboneJS-View setElement
描述
如果您想要将 Backbone 视图应用于不同的 DOM 元素，请使用 setElement，它还将创建缓存的 $el 引用并将视图的委托事件从旧元素移动到新元素。
语法
view.setElement(element) |
参数：
- element：它是可以从现有元素更改为不同元素的元素。
示例
<!DOCTYPE html>
<head>
<title>View Example</title>
<script src="https://code.jquery.com/jquery-2.1.3.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js" type="text/javascript"></script>
</head>
<body>
<div id="myview">
Enter your text: <input type="text"/>
</div>
<div id="myapp"></div>
<script type="text/javascript">
//'ViewDemo' 是视图类的名称
var ViewDemo = Backbone.View.extend({
//当您在输入标签中输入文本时，事件触发'sayHi'函数
events: {
'change input': 'sayHi'
},
//实例化视图时调用此函数
initialize: function() {
this.setElement($('#myview')); //'setElement' 改变与视图关联的元素
},
//当您输入文本时，它会在屏幕上显示以下行
sayHi: function() {
document.write('Welcome to Tutorialspoint!!!');
}
});
//'viewdemo'是'ViewDemo'类的实例
var viewdemo = new ViewDemo;
</script>
</body>
</html>
输出
让我们执行以下步骤来查看上述代码的工作原理：
将上述代码保存在 setElement.htm 文件中
在浏览器中打开此 HTML 文件。
