在移动视图中具有可排序父级的元素不会触发Backbone click事件

时间:2018-02-20 12:08:44

标签: javascript backbone.js jquery-ui-sortable

我在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函数中删除可排序代码,它就会开始工作。这对我来说真的很奇怪。任何人都可以指导如何处理这种情况?

0 个答案:

没有答案