主干视图多次触发事件委托
backbone view is triggering the event delegate many times
嗨,所以我在主干中有一个类似于这个的视图
app.FileListItemView = Backbone.View.extend({
tagName: 'li',
className: 'list-group-item clearfix',
events: {
'click .download-action': 'download'
},
template: _.template(
"<div class='pull-left' style='width: 80%'>'n'
<%= name %><br><span style='font-size: 10px;'><%= path %></span>'n'
</div>'n'
<div class='pull-right' style='width: 20%'>'n'
<div class='dropdown'>'n'
<button class='btn btn-default dropdown-toggle' type='button' data-toggle='dropdown'>'n'
Actions'n'
<span class='caret'></span>'n'
</button>'n'
<ul class='dropdown-menu' role='menu'>'n'
<li class='download-action' data-id='<%= id %>' data-accountid='<%= accountid %>' role='presentation'><a class='super-anchor' role='menuitem' tabindex='-1' href='#'>Download</a></li>'n'
</ul>'n'
</div>'n'
</div>"
),
initialize: function () {
},
render: function () {
this.$el.html(this.template(this.model));
return this;
},
download: function (event) {
//console.log(this.$el.find('.download-action-link').data('id'));
var el = this.$el.find('.download-action');
var id = el.data('id');
var accountid = el.data('accountid');
var url = app.config.get('apiURL');
var apiKey = app.config.get('apiKey');
console.log(el.prop('tagName'));
$.ajax(url + '/accounts/' + accountid + '/links', {
data: {
'file_id': id, 'direct': true
},
headers: {
Authorization: 'ApiKey ' + apiKey
},
type: 'POST',
success: function (data) {
if (data.active) {
var a = el.find('.super-anchor');
console.log(a);
//change this part
//a.attr('href', data.url).trigger('click');
//to this
a.attr('href', data.url).on('click', function(event){
event.preventDefault();
event.stopPropagation();
})[0].click();
}
}
});
}
});
这个想法是,当我点击带有"download action"类的LI时,下载方法在我的视图中被调用,应该从ajax调用中选择一个url,然后添加到LI下的ancht标记的href attr中,然后我触发锚点击,但当我这样做时,下载方式开始无限期地循环调用,有人能告诉我为什么会发生这种情况吗??谢谢
我假设触发的点击事件正在传播到li.download-action,然后再次启动ajax下载功能。解决方案是使用window.location.href将用户导航到新的url,或将该链接移出li.download-action.
相关文章:
- 取消绑定主干视图事件
- 在Angular ui路由器中,如何将事件从一个视图发送到另一个视图
- 如何测试主干视图是否正确侦听特定事件
- Ember视图未响应用户启动的事件
- 主干视图触发全局事件
- WinJs中的视图状态更改事件在哪里
- IBM BPM如何在Coach视图中处理按键事件
- 更改el属性时未激发主干视图事件
- 缓存主干视图及其事件
- 为什么每次重新渲染父视图时都需要重新委派子视图的事件
- 如何在angularjs中检查Kendo树视图数据绑定事件
- 骨干视图触发事件两次
- 当我认为它不应该重新渲染视图时,如何防止 Meteor 在 html 选择 dom 单击事件上重新渲染视图
- 将多个事件动态添加到多个 Web 视图
- 触发的事件被接收两次.如何找到鬼视图
- MVC-部分视图中元素上的Javascript事件
- 视图焦点的AngularJS事件
- 是否有任何事件“;在$scope摘要完成时”;或“;在视图刷新时”;在Angular.js中
- 如何在渲染新视图之前关闭所有事件
- Angular.js-Socket.io事件更新模型,而不是视图