2012-02-09 16 views
5

iScroll4プラグイン(http://cubiq.org/iscroll-4/)を使用して、ブラウザのビューポートの高さの80%を超えるページにスクロールバーを追加しています。何らかの理由で(この場合のみ)追加して入力をクリックしようとすると、選択されません。ラベルをクリックするだけで入力が選択されます。なぜ入力をクリックできないのですか?

iScroll4と選択可能な入力を行うにはどうすればよいですか?

+1

奇妙なことに、input要素を右クリックするだけで、(コンテキストメニューを閉じても)その要素にフォーカスが移動しますが、クリックはしません。 –

+0

はい、それは右クリックとラベルクリックで動作しますが、左クリックもしません:) – Atadj

+0

あなたのマークアップと関係するかもしれません。入力をラベルタグ内に入れ子にしてはいけません。マークアップは動的ですか?たぶん、ネストされたタグの数を減らすことに注意してください。 –

答えて

12

は、このソリューション

myScroll = new iScroll('wrapper', {}); 

    myScroll.options.onBeforeScrollStart = function(e) {     
     var target = e.target; 

     while (target.nodeType != 1) target = target.parentNode; 
     if (target.tagName != 'SELECT' && target.tagName != 'INPUT' && target.tagName != 'TEXTAREA'){ 
      e.preventDefault(); 
     } 
    } 
+1

ありがとう!チャームのように働いた! – Atadj

+1

はい!これは私のために働く。 – kaleazy

+0

WOOOOOOOOOO! +1ありがとう@ darryn.ten私はあなたにこれを尋ねるのが嫌いです、なぜ簡単にこのことが働いたのか説明できますか? - /あなたが時間があれば。再度、感謝します! – Red2678

4
$('input[type=text]').bind('touchstart click', function(){ 
    $(this).focus(); 
}); 
0
var myScroll; 
function loaded() { 
    myScroll = new iScroll('wrapper', { scrollbarClass: 'myScrollbar' }); 

    myScroll.options.onBeforeScrollStart = function(e) {     
     var target = e.target; 

     while (target.nodeType != 1) target = target.parentNode; 
     if (target.tagName != 'SELECT' && target.tagName != 'INPUT' && target.tagName != 'TEXTAREA'){ 
      e.preventDefault(); 
     } 
    } 
} 
document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false); 

document.addEventListener('DOMContentLoaded', loaded, false); 
0

私はバージョン5.1.2を使用して、それが働いてみてください。

window.myScroll = new IScroll ('#iscroll-wrapper', 
    probeType: 3, 
    mouseWheel: true, 
    scrollbars: true, 
    bounce: true, 
    keyBindings: true, 
    invertWheelDirection: false, 
    momentum: true, 
    fadeScrollbars: false, 
    interactiveScrollbars: true, 
    resizeScrollbars: true, 
    shrinkScrollbars: false, 
    click: false, 
    preventDefaultException: { tagName:/.*/ } 
} 
関連する問題