2016-04-19 12 views
0

私は複数の入力フィールドを持つtizen Webアプリケーションを持っています。ユーザーが下にスクロールしている入力をクリックすると、入力ドロワーが表示されます。したがって、ユーザーは入力フィールドを見ることができません。これをどうやって防ぐのですか?入力がtizenで選択されていると、divがスクロールされるのはなぜですか?

私はこれを使用してみました:

$('input').bind('focusin focus', function(e){ 
    e.preventDefault(); 
}); 

それは動作しません。

編集:ここでは はサンプル一部です:

<div class="ui-page" id=""> 
    <div class="ui-header"> 
     <h1 class="ui-title">Header</h1> 
    </div> 

    <div class="ui-content" id="history"> 
     <ul data-role="listview"> 
      <li><span>Input 1:</span> 
      </li> 
      <li> 
       <input type="tel" id="input1" style="background-color: #d1d1d1;"> 
      </li> 
      <li><span>input 2:</span> 
      </li> 
      <li> 
       <input type="number" id="input2" style="background-color: #d1d1d1;"> 
      </li> 

      <li><span>Input 3</span> 
      </li> 
      <li> 
       <input type="number" id="input3" style="background-color: #d1d1d1;"> 
      </li> 
     </ul> 

     <input class="ui-btn" type="button" onclick="done_click()" value="Done"> 
    </div> 

</div> 
+0

HTMLコード – RRR

+0

@RRRサンプルが編集で追加されました。 – lnman

答えて

1

次のコードは、フォーカスのご入力に自動スクロールします。この

を試してみてください。

$('input').bind('focusin focus', function(e){ 
    var $input = $(this); 
    $('html,body').stop().animate({ scrollTop: $input.offset().top } , '500', 'swing'); 
}); 

私も、offset - 25を設定します良好な視認性を提供し、それが上にいくつかのスペースを作成します。後でこれを調整することができます。

これで解決しない場合は、タイムアウトを設定してみてください。

$('input').bind('focusin focus', function(e){ 
    var $input = $(this); 
    setTimeout(function(){ 
     $('html,body').stop().animate({ scrollTop: $input.offset().top } , '500', 'swing'); 
    }, 345); 
}); 
+0

動作しませんでした。 – lnman

関連する問題