JavaScrip prohíbe la impresión de teclas de acceso directo, deshabilita combinaciones de teclas, monitores, bloques, addEventListener, DOMContentLoaded, preventDefault


el código

// 在网页加载完成后运行代码
document.addEventListener("DOMContentLoaded", () => {
    
    
    // 监听按键按下事件
    document.addEventListener("keydown", (event) => {
    
    
        // 判断按下的键是否为Ctrl键和P键
        if (event.ctrlKey && event.key === "p") {
    
    
            // 阻止事件默认行为(打印页面)
            event.preventDefault();
            // 可以选择在这里添加自己的提示或处理逻辑
            console.log("ctrl + p 已被阻止");
        }
    });
});

agregarEventListener

definición de w3school

addEventListener()Método para adjuntar un controlador de eventos a un elemento.

parámetro describir
tipo

requerido. El nombre del evento.

No utilice el prefijo "on".

Utilice "hacer clic" en lugar de "al hacer clic".


Lista completa de eventos DOM

función requerido. Función que se ejecutará cuando ocurra el evento.
utilizarCapturar

opcional (predeterminado = falso).

  • false- Los manipuladores se ejecutan en la fase de burbujeo.
  • true- Los controladores se ejecutan durante la fase de captura.

detalles técnicos

Este método agregará la función de escucha de eventos especificada a la colección de escuchas del nodo actual para manejar typeeventos del tipo especificado. En caso useCaptureafirmativo true, el oyente se registra como oyente de eventos de captura. En caso useCaptureafirmativo false, se registra como un detector de eventos normal.
addEventListener()Se puede llamar varias veces para registrar varios controladores de eventos para el mismo tipo de evento en el mismo nodo. Sin embargo, tenga en cuenta que DOMno se puede determinar el orden en el que se invocan varios controladores de eventos. Si una función de escucha de eventos se registra dos veces
en el mismo nodo con los mismos parámetros typey , se ignorará el segundo registro. useCaptureSi se registra un nuevo detector de eventos en un nodo mientras se procesa un evento en el nodo, no se llamará al nuevo detector de eventos para ese evento. Al clonar un nodo
con el método Node.cloneNode() o el método Document.importNode()Document , los detectores de eventos registrados para el nodo original no se copian.
Este método también se define en objetos Documento y Ventana y funciona de manera similar.


Contenido DOM cargado

MDN

El evento se activa cuando HTMLel documento está completamente analizado y todos los scripts diferidos ( <script defer src="…"> y <script type="module"> ) se han descargado y ejecutado . DOMContentLoadedNo espera a que termine de cargarse otro contenido como imágenes, subtramas y scripts asíncronos.
DOMContentLoadedNo espera a que se carguen las hojas de estilo, pero los scripts diferidos sí lo hacen y DOMContentLoadedlos eventos se ponen en cola después de los scripts diferidos. Además, los scripts no retrasados ​​o asíncronos (como <script>) esperarán a que se carguen las hojas de estilo analizadas.
El otro evento de carga solo se puede utilizar para detectar una página completamente cargada. Un error común es DOMContentLoadedutilizar loadeventos cuando son más apropiados.
Este evento no se puede cancelar.


prevenir valor predeterminado

w3escuela

Si el evento es cancelable, preventDefault()el método cancela el evento, lo que significa que la acción predeterminada perteneciente al evento no se llevará a cabo.
Útil cuando, por ejemplo:
hacer clic en un botón de enviar evita que se envíe un formulario.
Hacer clic en un enlace evita que el enlace sigaURL
No todos los eventos se pueden cancelar. Utilice el atributo cancelable para determinar si el evento es cancelable.
preventDefault()El método no impide que el evento se DOMpropague más. Utilice stopPropagation()el método para resolverlo.


MDN

Un método de la interfaz de eventos preventDefault()que le dice al agente de usuario que si el evento no se maneja explícitamente, sus acciones predeterminadas no deben realizarse como de costumbre. Este evento continúa propagándose, a menos que el detector de eventos llame a stopPropagation() o stopImmediatePropagation() para detener la propagación.

Supongo que te gusta

Origin blog.csdn.net/weixin_51157081/article/details/132433953
Recomendado
Clasificación