如何用主干停止触端事件在触端启动上的触发
How to stop the touchend event firing on touchstart with backbone
我正在使用backbone编写一个应用程序,并且已经达到了一个完整的卡住点,并且似乎无法发现touchend事件第二次在touchstart上被触发。
我第一次点击'。滑块'div一切都很好。然而,当我第二次触摸屏幕来移动幻灯片时,它会立即触发触点功能——而不是等到触点事件。是否有一种特殊的方式来处理触摸事件和脊柱?
下面是我的视图代码:
navigateTouch :function (event) {
event.preventDefault();
var xOrigPos = event.originalEvent.touches[0].pageX;
var startPos = parseInt($('.slider', this.$el).css('margin-left'));
var xPos = event.originalEvent.touches[0].pageX;
var move;
var stage = this.model.get('stage');
var extraMargin = parseInt($('.graphic', this.$el).css('margin-right'));
var movementSize = $('.slide', this.$el).width()+extraMargin;
var narrativeSize = $('.graphic', this.$el).length;
$('.slider', this.$el).on('touchmove', function (event) {
event.preventDefault();
xPos = event.originalEvent.touches[0].pageX;
move = (xPos + startPos) - (xOrigPos);
$('.slider', this.$el).css('margin-left', move);
});
$('.slider', this.$el).one('touchend', function (event) {
alert('fires')
event.preventDefault();
$('.slider', this.$el).unbind('touchmove');
if (xPos < xOrigPos) {
stage ++;
$('.slider', this.$el).animate({'margin-left': -(movementSize*stage)});
}
if (xPos > xOrigPos) {
stage --;
$('.slider', this.$el).animate({'margin-left': -(movementSize*stage)})
}
this.model.set({'stage':stage});
$('.progress', this.$el).removeClass('selected').eq(stage).addClass('selected');
});
}
我的观点在事件中有这个:
events: {
'click .controls':'navigateClick',
'click .progress':'navigateProgress',
'touchstart .slider':'navigateTouch'
}
和我的模板呈现如下:
<div class="slide">
<a href="#" class="button controls left">
</a>
<a href="#" class="button controls right">
</a>
<div class="slider clearfix">
{{#each graphic}}
<div class="graphic">
<img src="{{image}}" alt="{{alt}}" title="{{graphicTitle}}"/>
</div>
{{/each}}
</div>
<div class="indicators">
{{#each graphic}}
<a href="#" class="button progress"></a>
{{/each}}
</div>
</div>
我有一种感觉,这可能与我如何附加事件有关,但找不到任何关于使用骨干在事件内部附加事件的信息。
解决了我自己的问题…结果是,在touchend事件上触发一个警报会导致在点击'ok'按钮时调用另一个touchstart事件。
相关文章:
- 从控制器返回后Ajax启动事件激发
- 触摸启动事件未在iframe iOS 6中启动
- preventDefault之后的重新启动事件
- 如何获取在一系列事件中启动事件的元素
- 当窗口打开时,IE9在加载前启动事件
- 我的 JS 代码中的会话启动事件
- 仅当前一个事件完全完成时,才启动事件
- jQuery UI - 如何区分拖动/调整大小启动事件和单击事件
- Javascript “卡住”键(未注册的键启动事件)
- pace.js:“启动”事件未触发
- 在第一次触摸启动事件时禁用所有点击事件是个好主意吗?
- 如何将“拖动启动”事件与 CKEditor 实例分离
- 触摸启动事件上的Javascript触发函数
- 绑定到触摸启动事件,导致自动对焦集中在Mobile Safari中的任何单击上
- 触摸启动事件未在原来隐藏的按钮上工作
- 有没有一种方法可以使触摸启动事件不会触发点击事件
- 检测浏览器窗口是否处于活动状态,并在窗口再次处于活动状态后启动事件[JavaScript]
- 如何检测浏览器是否支持手势启动事件
- 首先启动事件,然后转到url
- 在IE7中无法捕获鼠标启动事件