2012-02-09 4 views
5

Uso il plug-in iScroll4 (http://cubiq.org/iscroll-4/) per aggiungere la barra di scorrimento alle pagine che superano l'80% dell'altezza della finestra del browser. Per qualche motivo quando (e solo in questo caso) aggiungo e provo a fare clic su input, non selezionerà. Solo cliccando sulla sua etichetta selezionerai l'input.Perché non riesco a fare clic sull'input?

Cosa posso fare per avere iScroll4 e l'input selezionabile?

+1

Abbastanza stranamente facendo clic con il tasto destro sugli elementi di input si sposta lo stato attivo su quell'elemento (anche se si chiude il menu di scelta rapida), ma non si fa clic. –

+0

Sì, funziona con il tasto destro del mouse e con il tasto dell'etichetta ma non con il tasto sinistro anche per me :) – Atadj

+0

Potrebbe avere qualcosa a che fare con il tuo markup. Non si dovrebbe annidare un input all'interno di un tag etichetta. Il markup è dinamico? Forse dovresti cercare di ridurre il numero di tag nidificati. –

risposta

12

provare questa soluzione

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

Grazie! Ha funzionato come un fascino! – Atadj

+1

Sì! Questo funziona per me. – kaleazy

+0

WOOOOOOOOOO! +1 Grazie @ darryn.ten Odio chiedertelo, potresti spiegare brevemente perché ha funzionato: -/Se hai tempo. Grazie ancora! – 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

Io uso la versione 5.1.2 e ha funzionato.

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