2012-02-09 194 views
5

我使用iScroll4插件(http://cubiq.org/iscroll-4/)將滾動條添加到長度超過瀏覽器視口高度80%的頁面。出於某種原因,當(並且僅在這種情況下)我添加它並嘗試點擊輸入時,它將不會選擇。只需點擊其標籤即可選擇輸入。爲什麼我不能點擊輸入?

我能做些什麼來使iScroll4和可選擇的輸入?

+1

奇怪的是,右鍵單擊'input'元素會將焦點移動到該元素(即使您關閉上下文菜單),但不能單擊。 – 2012-02-09 11:41:22

+0

是的,它適用於右鍵單擊和標籤單擊,但不是左鍵單擊也適用於我:) – Atadj 2012-02-09 11:44:29

+0

它可能與您的標記有關。您不應該在標籤標籤中嵌套輸入。標記是否動態?也許你應該考慮削減嵌套標籤的數量。 – 2012-02-09 13:46:09

回答

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 2012-02-28 20:20:00

+1

是的!這個爲我工作。 – kaleazy 2012-09-13 04:52:19

+0

WOOOOOOOOOO! +1謝謝@ darryn.ten我不想問你這個問題,你能否簡單解釋一下爲什麼這會起作用: - /如果你有時間。再次感謝! – Red2678 2013-10-08 16:22:49

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:/.*/ } 
}