2012-02-09 18 views
5

Estoy usando el plugin iScroll4 (http://cubiq.org/iscroll-4/) para agregar la barra de desplazamiento a páginas que tienen más del 80% de la altura de la ventana del navegador. Por alguna razón, cuando (y solo en este caso) lo agrego y trato de hacer clic en la entrada, no seleccionará. Solo haciendo clic en su etiqueta seleccionará la entrada.¿Por qué no puedo hacer clic en la entrada?

¿Qué puedo hacer para tener iScroll4 y una entrada seleccionable?

+1

Curiosamente, al hacer clic derecho en los elementos de 'entrada' se moverá el foco a ese elemento (incluso si se cierra el menú contextual), pero no se hace clic. –

+0

Sí, funciona al hacer clic con el botón derecho y al hacer clic con la etiqueta, pero no al hacer clic con el botón izquierdo también para mí :) – Atadj

+0

Podría tener algo que ver con su marcado. No debe anidar una entrada dentro de una etiqueta de etiqueta. ¿Es el marcado dinámico? Tal vez debería considerar reducir el número de etiquetas anidadas. –

Respuesta

12

Pruebe esta solución

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

¡Gracias! ¡Trabajado como un encanto! – Atadj

+1

¡Sí! Esta funciona para mí. – kaleazy

+0

¡WOOOOOOOOOO! +1 Gracias @ darryn.ten Odio preguntarle esto, ¿podría explicar brevemente por qué funcionó esto? -/Si tiene algo de tiempo. ¡Gracias de nuevo! – 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

utilizo la versión 5.1.2 y funcionó.

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