mecanismo de eventos de base -jQuery front-end

mecanismo de eventos Capítulo 8 jQuery

  • JavaScript ha estudiado el incidente, evento jQuery JavaScript en el paquete, para aumentar y ampliar el mecanismo de control de eventos. jQuery no sólo proporciona una sintaxis más elegante manejo de eventos, sino que también mejoran en gran medida la capacidad de procesamiento del evento.

8.1 jQuery desarrollo de eventos (comprender)

evento -bind caso -delegate de enlaces de sucesos -en unión unión unión evento simple (recomendado)

  • Simple registro de eventos
click(handler)			单击事件
mouseenter(handler)		鼠标进入事件
mouseleave(handler)		鼠标离开事件
  • El inicio de sesión se unen al evento (no hacerlo)
// 第一个参数:事件类型
// 第二个参数:事件处理程序
$('p').bind('click mouseenter', function(){
    // 事件响应方法
});
  • evento de registro delegado delegado (no hacerlo)
// 第一个参数:selector,要绑定事件的元素
// 第二个参数:事件类型
// 第三个参数:事件处理函数
$('.parentBox').delegate('p', 'click', function(){
    // 为 .parentBox下面的所有的p标签绑定事件
});

8.2 en evento de registro (enfoque)

  • Después jQuery1.7, jQuery utiliza en un enfoque unificado para todos los eventos.
  • Se recomienda encarecidamente a su uso.

Registro de evento simple

// 表示给$(selector)绑定事件,并且由自己触发,不支持动态绑定。
$(selector).on( 'click', function() {});

Registro de delegación de eventos

// 表示给$(selector)绑定代理事件,当必须是它的内部元素span才能触发这个事件,支持动态绑定
$(selector).on( 'click','span', function() {});

Registro de empresa en caso de sintaxis:

// 第一个参数:events,绑定事件的名称可以是由空格分隔的多个事件(标准事件或者自定义事件)
// 第二个参数:selector, 执行事件的后代元素(可选),如果没有后代元素,那么事件将由自己执行。
// 第三个参数:data,传递给处理函数的数据,事件触发的时候通过event.data来使用(不常使用)
// 第四个参数:handler,事件处理函数
$(selector).on(events[,selector][,data],handler);

8.3 desagregación del Evento

  • forma de desvinculación (no hacerlo)
$(selector).unbind(); // 解绑所有的事件
$(selector).unbind('click'); // 解绑指定的事件
  • undelegate manera (no hacerlo)
$( selector ).undelegate(); // 解绑所有的delegate事件
$( selector).undelegate( 'click' ); // 解绑所有的click事件
  • el modo de apagado (recomendado)
// 解绑匹配元素的所有事件
$(selector).off();
// 解绑匹配元素的所有click事件
$(selector).off('click');

evento de disparo 8.5

$(selector).click(); // 触发 click事件
$(selector).trigger('click');

8,6 jQuery objeto de evento

jQuery objeto de evento es en realidad un paquete js objeto de evento, la compatibilidad de procesos.

// screenX和screenY	对应屏幕最左上角的值
// clientX和clientY	距离页面左上角的位置(忽视滚动条)
// pageX和pageY	距离页面最顶部的左上角的位置(会计算滚动条的距离)

// event.keyCode	按下的键盘代码
// event.data	存储绑定事件时传递的附加数据

// event.stopPropagation()	阻止事件冒泡行为
// event.preventDefault()	阻止浏览器默认行为
// return false:既能阻止事件冒泡,又能阻止浏览器默认行为。
Liberadas 1800 artículos originales · ganado elogios 1922 · Vistas de 170.000 +

Supongo que te gusta

Origin blog.csdn.net/weixin_42528266/article/details/105115298
Recomendado
Clasificación