フレームワーク7キーパッド+スワイプ非互換性

Question

タイトルとして、キーパッドがスワイプ内にあるとき、それは動作しません。

myApp.keypad({ 'input': '.kpNumpad', 'dotButton': true, 'toolbarCloseText': 'Fechar', 'toolbarTemplate': '' }); 

myApp.swiper('.swiper-container',{ 
    'onlyExternal': true, 
    'nextButton': '.swiper-button-next', 
    'prevButton': '.swiper-button-prev', 
    'speed': 600, 
    'loop': true, // <- DON'T USE IT, set it to false (see my answer) 
    'effect': 'slide' //-- slide, coverflow, flip 
}); 

どんなにswiperまたはキーパッドは、それらのどれも動作しない、最初に呼び出された場合ため、ブラウザ内のデバッグ、キーパッドのDIVが作成されます。

<div class="swiper-container"> 
    <div class="swiper-wrapper"> 
     <div class="swiper-slide" style="text-align:center"> 
      <h3>Product name</h3> 
      <div class="range-slider"><input type="range" min="0" value="" step="1" onchange="$$(this).parent().parent().find('span').html(this.value);" oninput="$$(this).parent().parent().find('input').val(this.value);"></div> 
      <div class="list-block"> 
       <ul> 
        <li><div class="item-content"> 
         <div class="item-inner"> 
          <div class="item-title label">Qtd</div> 
          <div class="item-input"> 
           <input type="text" class="kpNumpad"> 
          </div> 
         </div> 
        </div></li> 
       </ul> 
      </div> 
      <img src="img/temp/img01-mobile-md.jpg" style="max-height: 45vh;"> 
     </div> 
    </div> 
    <div class="swiper-button-prev"></div> 
    <div class="swiper-button-next"></div> 
</div> 

スクリプトは、キーパッド+スワイプを作成します表示されず、入力は非循環になります。

Answer 1

問題は、キーパッド入力ごとにインスタンスを作成することで解決します。

window.top.myKeyPad = []; 
$$('.kpNumpad').each(function(){ 
    var kpNum = myApp.keypad({ 'input': $(this), 'dotButton': true, 'toolbarTemplate': '' }); 
    window.top.myKeyPad.push(kpNum); 
}); 

注：偽== Swiperパラメータ「ループ」を避け、それはキーパッドを破るだろう、また、私は非常にループが

を再起動すると、それはあなたの入力値が消去されますようにそれを使用しないことをお勧めします