Стартовый плагин jquery - PullRequest
Новая
       1

Стартовый плагин jquery

2 голосов
/ 25 января 2020

как добиться этого с помощью jquery системы плагинов 

 $('.selector').myPlugin(function(id){
     alert(id);
 });

Как закодировать плагин myPlugin , чтобы он работал точно так же, как приведенный выше код.

Это всем, спасибо

Ответы [ 3 ]

3 голосов
/ 25 января 2020

Вы можете определить myPlugin функцию следующим образом: 

$.fn.myPlugin = function (callback) {
  var id = $(this).prop('id');

  if (typeof callback === 'function') {
    callback(id);
  }
};

$('.selector').myPlugin(function(id){
   alert(id);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="greeting" class="selector">Greeting!</div>
0 голосов
/ 25 января 2020

Вы можете использовать прототип jQuery $.fn, вот пример. Обратите внимание, что я настроил это так, чтобы он возвращал массив идентификаторов, потому что вы показываете прикрепление этого к классу, что означает, что он на самом деле может быть связан с несколькими элементами на странице 

$.fn.myPlugin = function(callback) {
  var ids = [];
  if (typeof callback === 'function') {
    $(this).each(function() {
            ids.push(this.id);
    });
    var id = $(this).attr('id');
    callback(ids);
  }
};


$(function() {

  $('.selector').myPlugin(function(ids) {
    console.log(ids);
  });

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="selector" id="someId1">
</div>
<div class="selector" id="someId2">
</div>
0 голосов
/ 25 января 2020

вы не можете получить идентификатор от анонимной функции в качестве аргумента. 

//create myPlugin function for manage your plugin
function myPlugin(id){
    alert(id);
    //enter your code here
}

$('.selector').on('click', function(){
    let id = $(this).attr('id');
    myPlugin(id);
});
<html>
  <head>
    <title>My plugin</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" >
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  </head>
  <body>
      <button type="button" class="btn btn-primary selector" id="YourId" >Click me</button>
  </body>  
</html>

Попробуйте этот скрипт.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...