2012-12-30 46 views
0

我正在寫一個應用程序使用骨幹,並已達到一個完整的關卡,並且似乎無法找到touchend事件正在第二次touchstart被解僱。如何停止touchend事件觸發與骨幹touchghart

我第一次點擊'.slider'div一切正常。然而,當我第二次觸摸屏幕來移動幻燈片時,它會立即觸發touchend功能 - 而不是等待touchend事件。是否有處理觸摸事件和骨幹的特殊方式?

這裏是我的視圖代碼:

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> 

我有一種感覺這可能與我如何附加事件有關,但無法找到關於在事件中附加事件的任何信息使用主幹。

回答

2

解決了我自己的問題...... whooo!在觸發事件中觸發警報會導致在單擊「確定」按鈕時調用另一個觸發事件。只有在iPhone和iPad上......很奇怪。

+0

你好,我有同樣的問題。你是如何解決它的?你是否必須刪除警報? – alemangui

+0

只需移除警報即可解決問題。這是有道理的,因爲iphone將觸摸警報作爲有效事件觸摸事件。 – darylhedley