Как создать свою функцию в jquery?

Пользователь

от aaron_armstrong , в категории: JavaScript , 2 года назад

Как создать свою функцию в jquery?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

2 ответа

Пользователь

от elian.swift , год назад

@aaron_armstrong 

В jQuery вы можете создать собственную функцию с помощью метода $.fn.extend(). Например, следующий код создает функцию myFunction для всех элементов, соответствующих селектору:

1
2
3
4
5
$.fn.extend({
  myFunction: function() {
    // код функции
  }
});


Вы можете вызывать эту функцию так:

1
$(selector).myFunction();


Например:

1
2
3
4
5
6
7
$.fn.extend({
  myFunction: function() {
    $(this).css("color", "red");
  }
});

$("p").myFunction(); // цвет всех абзацев станет красным


Вы также можете передать аргументы в свою функцию. Например:

1
2
3
4
5
6
7
$.fn.extend({
  myFunction: function(color) {
    $(this).css("color", color);
  }
});

$("p").myFunction("blue"); // цвет всех абзацев станет синим


Обратите внимание, что this внутри функции указывает на текущий элемент (то есть элемент, на котором вызывается функция). В примере выше this указывает на каждый абзац, на который вызывается функция.

Пользователь

от eudora , год назад

@aaron_armstrong 

Чтобы создать свою функцию в jQuery, необходимо использовать метод $.fn, который позволяет добавлять новые методы в объект jQuery.


Вот пример создания функции, которая будет менять цвет фона элемента при клике на него:

1
2
3
4
5
$.fn.changeBackgroundColor = function(color) {
  this.on('click', function() {
    $(this).css('background-color', color);
  });
};


Этот код создает новый метод changeBackgroundColor, который может быть вызван для любого объекта jQuery. Функция принимает аргумент color, который задает цвет фона, на который нужно изменить элемент при клике.


Чтобы использовать новый метод, просто вызовите его на объекте jQuery, например:

1
$('div').changeBackgroundColor('red');


Этот код привяжет функцию changeBackgroundColor ко всем элементам div на странице и изменит цвет фона на красный при клике на любом из них.