Cuando utilizo jQuery para un simple clic evento sólo funciona para los enlaces. Es allí una manera de hacer que funcione para luces etc:

$("span.clicked").live("click", function(e){alert("span clicked!")});

$("a.clicked").live("click", function(e){alert("link clicked!")});

El LAPSO funciona en Safari pero no Mobile Safari (en el iPhone o iPad), mientras que la etiqueta funciona en ambos.

  • Creo que la respuesta debe ser cambiado a stackoverflow.com/a/4910962/16940 por Plynx y no la actual respuesta de Sam. Plynx la respuesta definitivamente tiene los votos y el apoyo.
InformationsquelleAutor Gazzer | 2010-06-11

8 Comentarios

  1. 125

    He luchado con esto. Después de un montón de juguetes por todos lados y tratando de averiguar el problema, me encontré con una solución simple.

    Si ajusta el elemento de la cursor a pointer, que por arte de magia funciona de nuevo con Jquery en vivo y el evento click. Esto sólo puede ser establecido a nivel mundial en el CSS.

    • Ha sido la búsqueda de una solución como esta desde hace meses, gracias. Me ha llegado con iphone/pod/pad detección y el cambio de los eventos de clic para otros eventos sólo para esos dispositivos. Esto es mucho mejor.
    • tenga en cuenta que esto no funciona si no cursor: pointer; en hover.
    • usted puede elaborar? no hay flotar en un ipad o estás hablando de esta rompiendo las versiones de escritorio en un poco de respeto, o ‘Samsung hover sobre el Galaxy S4’ ?
    • cursor: pointer; } no funciona, acabo de hacer div { cursor: pointer; }
    • CSS Cursor:Pointer; es una gran solución. FastClick github.com/ftlabs/fastclick es otra solución.
    • esto tenía la ventaja añadida de que una mano se muestra el icono para los usuarios de escritorio – útil si el elemento no es, obviamente, puede hacer clic. también cuando se utiliza touch eventos sólo se activan inmediatamente en la toma de contacto que puede entrar en conflicto con una simple acción de desplazamiento.
    • Esta es la respuesta correcta – registrarse haga clic en evento como es habitual en cualquier elemento de DOM, y asegúrese de que el cursor: puntero se establece en el css, pero no en hover.

  2. 27

    Usted necesita para escuchar la «touchstart» y «touchend» eventos». Agregar a los oyentes con jQuery…

    $('span').bind( "touchstart", function(e){alert('Span Clicked!')} );

    Que usted puede desear para escuchar un touchstart y touchend para que usted pueda verificar que el elemento víctimas cuando los dedos tocan es el mismo que el elemento de víctimas cuando el dedo se quita.

    Estoy seguro de que probablemente hay una mejor manera de hacerlo, pero que debe trabajo 🙂

    Edit: Hay una manera mejor! Ver https://stackoverflow.com/a/4910962/16940

    • Gracias. ¿Significa esto que el iPhone ignora haga clic en los eventos, excepto a los enlaces (tal vez porque de las otras posibles gestos) ?
    • Yo creo que como < /a> etiquetas funcionan de la manera en que lo hacen es decir que está ahí para ser pulsado – webkit para móviles controla el evento click de forma automática. Yo no conozco a este seguro. Es sólo una suposición
    • Le falta un paréntesis de cierre. Debe ser $(‘span’).bind( «touchstart», function(e){alert(‘Span Clic!’)});
    • Gracias, este es el trabajo para luces, divs y botones, pero no para la imagen de la etiqueta.. por Favor, sugiera
    • NO NO NO NO (casi seguro) – ver @Plynx la respuesta
    • Bueno, Plynx’ también pueden funcionar, pero esta respuesta también parece resolver las cosas de forma aceptable en mi caso de uso hoy en día. ¿Cuál es la debilidad? Cómo podría Sam, la respuesta ser mejor? Hay un peligro de utilizar touchstart? O ¿solo se siente la otra respuesta es una solución de limpieza (y por qué)?
    • Si usted utiliza «touchstart’, los desencadenar el evento inmediatamente. esto incluye cuando el usuario se desplaza por la pantalla y toque su ‘span’ por error. la gente espera para desplazarse por el contacto con cualquier parte de la pantalla sin que la activación de un clic cada vez desplaza de una página y había un anuncio emergente? molesto no lo es! además de que simplemente no es necesario cuando se utiliza el pointer: cursor css y que tiene el beneficio añadido de mostrar un icono en forma de mano para los usuarios de escritorio. cuando se utiliza toque’ de los eventos es buena idea considerar el uso de una biblioteca porque no se agregan complejidad para dispositivos con pluma + táctil.
    • véase también mi respuesta aquí: stackoverflow.com/a/17490775/16940
    • también – y no estoy completamente seguro acerca de esto, pero en iOS que ciertas acciones pueden llevarse a cabo sólo cuando hay un verdadero clic – por razones de seguridad. Creo que eventos de toque no «contar» en este caso. por ejemplo. para la reproducción de un vídeo en el que un iPhone se necesita un clic y usted no puede auto-play

  3. 21

    Usted realmente no necesita utilizar el touchstart o touchend evento, tan largo como el ‘span’ tag (o cualquier otra cosa que no sea ‘un’ tag) tiene una propiedad css de:

    cursor:pointer

    el clic registrar

  4. 2

    También puede engañar al navegador para generar eventos de clic mediante la adición de un vacío atributo onclick. Por un cinturón y los tirantes enfoque en el caso de que cualquier enfoque deja de funcionar en cualquier actualización de iOS, usted podría usar algo como esto:

    $("span.clicked").live("click", function(e){alert("span clicked!")})
                     .attr('onclick','')
                     .css('cursor','pointer');

    (asumiendo que no tienen ningún real onclick atributos no le importa destruir a)

  5. 2

    Puede agregar un vacío onclick atributo, así:

    <span onclick=''>Touch or Click Me</span>
    jQuery('span').live('click', function() { alert('foo'); });
  6. 1

    He probado de todo, y ninguno de los trucos trabajado. Resultó que no podía entrar, haga clic en eventos, porque tenía un elemento de vídeo bajo mi img. vídeo de elementos aparentemente comer, haga clic en eventos.

    • Tengo el mismo problema. El video de la etiqueta de la parte inferior está el problema. ¿La solución?
    • Creo que me terminó de ocultación (display: none) el elemento de vídeo. Parecía ser la única manera.
  7. 1

    Cuando la orientación de iOS tienes que tener en consideración: hacer caso de la delegación en jQuery como $(document).on('click', '.target-element', function (event) {...}); no funcionará. Usted tiene que agregar onclick="" a la meta elemento HTML o cursor: pointer a sus estilos.

    Tomado y adaptado de http://gravitydept.com/blog/js-click-event-bubbling-on-ios:

    Resulta que Safari en el iPhone no soporta caso de delegación de eventos click, a menos que el clic se lleva a cabo en un enlace o de entrada. Afortunadamente, hay soluciones disponibles.

    Esa es la razón, mientras que el <a> etiqueta de obras, mientras que <span> no.

  8. 0

    Mi enfoque para resolver este malentendido en el documento.haga clic en.

    1. Agregar en html después de la etiqueta de cuerpo de la etiqueta siguiente

      <body>
      <div id="overlaySection" onclick="void(0)"></div>
      ...
      </body>

    2. Un poco de estilo para que la etiqueta de

      `#overlaySection {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 1;
        width: 100%;
        height: 100%;
        background: rgba(255, 255, 255, 0);
        cursor: pointer;
        visibility: hidden;
        opacity: 0;
        content: "";
      }
      #overlaySection.active {
       opacity: 1;
       visibility: visible;
      }`
    3. Algunos de JQuery personal

      //hide overlay on document click
      $('#overlaySection').click(function(){
      $(this).removeClass('active');
      });

    y lo principal activo de esta superposición

    $('.dropdown > span').click(function() {
        ...
        $('#overlaySection').addClass('active');
        ...
    });

    La esperanza de que este enfoque va a ser útil para alguien. Feliz codificación!

Dejar respuesta

Please enter your comment!
Please enter your name here