evento - javascript on mouse click

Activación del evento onclick con un clic medio

Question

Estoy usando el evento onclick de un enlace hash para abrir un <div> como un pop-up. Pero el clic medio no onclick evento onclick , solo toma el valor del atributo href del enlace y carga la URL en una página nueva. ¿Cómo puedo usar el medio clic para abrir el <div> como una ventana emergente?

Answer 1

El método correcto es usar .on , ya que .live ha quedado obsoleto y luego eliminado de jQuery:

$("#foo").on(''click'', function(e) { 
   if( e.which == 2 ) {
      e.preventDefault();
      alert("middle button"); 
   }
});

O si desea la sensación "en vivo" y #foo no aparece en su página al inicio del documento:

$(document).on(''click'', ''#foo'', function(e) { 
   if( e.which == 2 ) {
      e.preventDefault();
      alert("middle button"); 
   }
});

respuesta original

Answer 2

Esta pregunta es un poco vieja, pero encontré una solución:

$(window).on(''mousedown'', function(e) { 
   if( e.which == 2 ) {
      e.preventDefault();
   }
});

Chrome no activa el evento de "clic" para la rueda del mouse

Trabaja en FF y Chrome

Answer 3

La respuesta de beggs es correcta, pero parece que quiere evitar la acción predeterminada del clic medio. En ese caso, incluya lo siguiente

$("#foo").on(''click'', function(e) { 
   if( e.which == 2 ) {
      e.preventDefault();
      alert("middle button"); 
   }
});

preventDefault() detendrá la acción predeterminada del evento.

Answer 4

Normalmente odio cuando las personas ofrecen alternativas en lugar de soluciones, pero como ya se han proporcionado soluciones, voy a romper mi propia regla.

Los sitios web en los que se anula la función de hacer clic en el medio tienden a molestarme realmente. Por lo general, hago clic con el botón central porque quiero abrir el nuevo contenido en una pestaña nueva y tener una vista sin obstáculos del contenido actual. Cada vez que puede dejar la funcionalidad del medio clic solo y hacer que el contenido relevante esté disponible a través del atributo HREF de su elemento cliqueado, creo firmemente que eso es lo que debe hacer.

Answer 5

Para que se detecte el botón de medio clic / rueda del mouse, debe usar el evento auxclick . P.ej:

<a href="https://example.com" onauxclick="func()" id="myLink"></a>

Luego en tu archivo de script

func() {
    alert("middle button clicked")
}

Si desea hacerlo desde JavaScript, addEventListener al elemento:

let myLink = document.getElementById(''myLink'')
myLink.addEventListener(''auxclick'', function(event) {
    alert("middle button clicked")
})

Consulte la página mdn sobre el evento auxclick here .

Answer 6

Puedes usar

event.button

para identificar en qué botón del mouse se hizo clic.

Devuelve un valor entero que indica el botón que cambió el estado.

• 0 para ''clic'' estándar, generalmente botón izquierdo
• 1 para el botón del medio, generalmente rueda-clic
• 2 para el botón derecho, por lo general, haga clic con el botón derecho

Tenga en cuenta que esta convención no se sigue en Internet Explorer: vea QuirksMode para más detalles.

El orden de los botones puede ser diferente dependiendo de cómo se haya configurado el dispositivo señalador.

Lea también

¿Qué botón del mouse se ha hecho clic?

Hay dos propiedades para descubrir en qué botón del mouse se ha hecho clic: qué botón y. Tenga en cuenta que estas propiedades no siempre funcionan en un evento de clic. Para detectar de manera segura un botón del mouse, debes usar los eventos mousedown o mouseup.

Answer 7

Sé que llego tarde a la fiesta, pero para aquellos que todavía tienen problemas con el manejo del clic central, verifique si delega el evento. En caso de delegación, el evento click no se activa. Comparar:

Esto funciona para clics medios:

$(''a'').on(''click'', function(){
    console.log(''middle click'');
});

Esto no funciona para clics medios:

$(''div'').on(''click'', ''a'', function(){
    console.log(''middle click'');
});

Si aún necesita seguir el clic del medio utilizando la delegación de eventos , la única forma de mousedown mouseup como se indica en el ticket jQuery correspondiente, es usar mousedown o mouseup en mouseup lugar. Al igual que:

Esto funciona para clics medios delegados:

$(''div'').on(''mouseup'', ''a'', function(){
    console.log(''middle click'');
});

Véalo en línea aquí .

Answer 8

jQuery proporciona un atributo .which en el evento que da el id del botón de clic de izquierda a derecha como 1, 2, 3. En este caso, quiere 2.

Uso:

$("#foo").live(''click'', function(e) { 
   if( e.which == 2 ) {
      alert("middle button"); 
   }
}); 

La respuesta de Adamantium también funcionará, pero debes tener cuidado con IE, ya que él señala:

$("#foo").live(''click'', function(e) { 
   if((!$.browser.msie && e.button == 1) || ($.browser.msie && e.button == 2)) { 
     alert("middle button"); 
   } 
});

Recuerde también que el atributo .button tiene 0 indexado y no 1 indexado como .which .