我在Chrome浏览器的移动视图中遇到了一些奇怪的问题。可排序列表中元素(按钮)的单击事件不会被触发。这就是我的html的样子
private void setClickableAnimation(Context context)
{
TypedValue outValue = new TypedValue();
context.getTheme().resolveAttribute(
android.R.attr.selectableItemBackground, outValue, true);
setForeground(getDrawable(context, outValue.resourceId));
}
这是我的Backbone视图代码
<li data-id="4">
<div class="name">New test service</div>
<div class="actions">
<a href="/service/4" class="btn btn-default btn-xs">View</a>
<button type="button" data-id="4" class="btn btn-primary btn-xs update">Update</button>
<button type="button" data-id="4" class="btn btn-danger btn-xs delete">Delete</button>
</div>
</li>
所有 Admin.Views.InternalListServicesView = Admin.Views.BaseMainView.extend({
el: 'body',
events: {
'click .create': 'createClicked',
'click .update': 'updateClicked',
'click .delete': 'deleteClicked'
},
initialize: function() {
var self = this;
this.constructor.__super__.initialize.apply(this, arguments);
this.addSubView('modal', new Admin.Views.Modal()).render();
$('.listInternalTable ul').sortable({
group: 'listInternalTable',
helper : 'clone',
placeholder: '<li class="defaultPlaceholder"/>',
onDrop: function(item, container, _super) {
_super(item);
self.syncItemPositions();
}
});
},
createClicked: function() {
if(this.subViewExists("create")){
this.removeSubView("create");
}
var view = new Admin.Views.InternalCreateServiceView();
this.addSubView("create", view).render();
},
updateClicked: function(e) {
var el = $(e.currentTarget);
var model = new Admin.Models.InternalInternalModel({
id: el.data('id')
});
if(this.subViewExists("update")){
this.removeSubView("update");
}
var view = new Admin.Views.InternalUpdateServiceView();
view.setModel(model);
this.addSubView("update", view).render();
},
deleteClicked: function(e) {
var el = $(e.currentTarget);
var model = new Admin.Models.InternalInternalModel({
id: el.data('id')
});
if(this.subViewExists("delete")){
this.removeSubView("delete");
}
var view = new Admin.Views.InternalDeleteInternalView();
view.setModel(model);
this.addSubView("delete", view).render();
},
syncItemPositions: function() {
var blob = [];
$('.listInternalTable').each(function() {
var li = $(this).find("ul li:not('.empty')");
li.each(function(k, item) {
blob.push({
id: $(this).data('id'),
position: k + 1
});
});
});
var action = Admin.Commands.get("internal.service.reorder");
var promise = action.execute({data: blob});
}
});
都是可排序的。所有列表项中的所有按钮都在Web视图中完美运行。但是在<li>
中,在移动视图中没有触发任何点击事件。如果我在initilize函数中删除可排序代码,它就会开始工作。这对我来说真的很奇怪。任何人都可以指导如何处理这种情况?