Jquery события, связанные операции

Jquery события, связанные операции

Связующие события

1. .bind ()

• Вы можете связать несколько событий, в то же время, как элементы
• Первый параметр: Имя события,
• Второй параметр: обработчик событий - анонимные функции

Привязывает .bind события ( «название события», «Обработчик») связывает множество событий .bind ({ «имя события»: «обработчик», «Имя события»: «обработчик», «название события» : "обработчик"})

//绑定单个事件
 $("#btn").bind("click",function () {
	alert("我被点了");
});

 //bind()方法可以为元素同时绑定多个事件
$("#btn").bind({"click":function(){
	alert("我被点了");
},"mouseover":function(){
	$(this).css("backgroundColor","red");
},"mouseout":function(){
	$(this).css("backgroundColor","");
}});
复制代码

2. .delegate ()

• Элемент Параметры 1. Для привязки событий --- р
• 2. Имя параметра, чтобы связать события --- нажмите
• 3. параметр обработчика события связывания --- анонимная функция

//给div标签里面的p标签添加事件
$("#dv").delegate("p","click",function () {
	alert("我被点了");
})
复制代码

3. на()

• Два параметра
  • 1 Название события
  • обработчик события 2
• Три параметра
  • 1, название события
  • --P 2. Элемент, чтобы связать события
  • 3 обработчики событий

Родительский элемент .он ( «Тип события», «дочерний элемент», обработчик событий);

$("#btn").on("click",function () {
	//创建p添加到div中
	$("#dv").append($("<p>这是一个p</p>"));
	
	//为div中的p标签绑定事件
	$("#dv").on("click","p",function () {
		alert("我被点了");
	});
});
复制代码

Примечание: == В практических приложениях, обычно используемых в общем, связываются и не делегируют используется ==

Разделение события

1. Связывание и развязывающие события

   • связывания () отвязать ()
   • deledae () undelegate ()
   • вкл выкл()

2. параметры

   • Имя (название события) для развязывания событий
   • (Элементы, название события) выпустили вид связывания событий для этого элемента

3. Пример:

$("#dv").unbind("click");
$("#dv").undelegate("click");
$("#dv").off("click");
复制代码

4. Отец и отношения элементов сына событие разукрупнение

//下面的代码是把子级元素的点击事件解绑了,父级元素的点击事件还存在
$("#dv").off("click","**");
//移除父级元素和子级元素的所有的事件
$("#dv").off();
复制代码

Примечание:

Родительский элемент и дочерние элементы являются обязательными события через обычным способом, через офф, если разукрупнение> время, решение событие родительские элементы привязанные, элементы событий суб-уровня не разукрупнения

但是:如果子级元素是通过父级元素调用delegate的方式绑定的事件,父>级元素使用off方式解绑事件,这个时候父级元素和子级元素的相同的事>件都会被解绑
复制代码

триггер события

1. Прямой вызов, чтобы вызвать метод элемента
2. Использование: trigget (название события)
3. Использование: triggerHandler (название события)

 $(function () {
	$("#btn1").click(function () {
		$(this).css("backgroundColor","red");
	});
	
	//点击第二个按钮-触发第一个按钮的点击事件
	$("#btn2").click(function () {
	
		//触发事件--3三种方式
		$("#btn1").click();
		
		$("#btn1").trigger("click");//触发事件
		
		$("#btn1").triggerHandler("click");//触发事件
	});
});
复制代码

Примечание: триггер () и triggerHandler () разница

триггер () будет вызывать поведение по умолчанию браузера, и запускает событие triggrtHandler () не вызывает поведение по умолчанию браузера, но будет выполнять такие события, как: фокус, чтобы получить поведение по умолчанию браузера

$("#txt").trigger("focus");		//文本框获取到焦点了
$("#txt").triggerHandler("focus");	//文本框没有获取到焦点了
复制代码

Объект события

$ ( "DIV"). На ( "клик", функция (событие) {})

• event.delegateTarget: Код привязки объекта события
• event.currentTarget: объект связывания события
• event.target: реальные объекты, чтобы вызвать события

Отменить кипящее событие события по умолчанию

Отменить кипящий событие

1. event.stoPropagation ()
2. вернуться ложным

Отменить событие по умолчанию

1. event.preventDefault ()
2. вернуться ложным;

Например, вы можете отменить событие по умолчанию для $ метку ( «а»). PreventDefault ()

Воспроизводится в: https: //juejin.im/post/5cf20bc5e51d4577596486a9