Массивное всплывающее окно: Получить текущий элемент в обратном вызове

Question

В Magnific Popup я хочу получить атрибут в ссылке, которая нажата, и использовать ее в функции обратного вызова (используя обратные вызовы: открывать), чтобы внести некоторые изменения в DOM.

Как я могу это сделать? Например, в приведенном ниже коде он должен возвращать «он работает» для консоли. Вместо этого он печатает «does not work». Пожалуйста помоги!!

<a href="#test-popup" class="open-popup-link" myatt="hello">Show inline popup</a> 

<script src="jquery.magnetic.custom.js"></script> 

<script> 

    $(document).ready(function() { 
     $('.open-popup-link').magnificPopup({ 
     type:'inline', 
     midClick: true, 
     callbacks: { 
      open: function() { 

      if ($(this).attr('myatt')=="hello") 
      { 
       // do something 
       console.log("it works"); 
      } 
      else 
      { 
       console.log("doesnt work"); 
      } 

      }, 
      close: function() { 

      } 
     } 

     }); 
    }); 

</script> 

<div id="test-popup" class="white-popup mfp-hide"> 
    Popup content 
</div> 

Answer 1

// "item.el" is a target DOM element (if present) 
// "item.src" is a source that you may modify 
open: function(item) {} 

и использование данных-атрибутов, к примеру данных-Myatt - которые получают:

$(this).data('myatt') 

Answer 2

Во-первых, я рекомендую вам использовать атрибут данных (данных пользовательских = "Foo ") или известный атрибут.

HTML:

<a href="photo.jpg" class="popup" data-custom="dsaad">Do it!</a> 
    <a href="photo.png" class="popup" data-custom="mycustomdata">Do it!</a> 

JQuery:

$('.popup').magnificPopup({ 
    type : 'image', 
    callbacks : { 
    open : function(){ 
     var mp = $.magnificPopup.instance, 
      t = $(mp.currItem.el[0]); 

     console.log(t.data('custom')); 
    } 
    } 
}); 

Я не знаю, если лучший способ существует. На самом деле вы можете прочитать их документацию о публичных методах, и вы увидите там. Я тестировал код, указанный выше, и все работает отлично :)

Answer 3

Для Magnific Popup v0.9.8

var magnificPopup = $.magnificPopup.instance, 
       cur = magnificPopup.st.el; 
console.log(cur.attr('myatt')); 

Answer 4

щелкнул элемент можно получить в функции обратного вызова с помощью:

this.st.el 

Внутри функции обратного вызова, «this» относится к $ .magnificPopup.instance.

Под открытым свойствам:

"magnificPopup.st.el // Target щелкнул элемент, который открыл всплывающее окно (работает, если всплывающее окно инициализируется из DOM элемента)"

Answer 5

Кроме того, внутри open: function(item) {}, this.content мощь help. Он вернет div отображаемого содержимого. полезно также с change: function() {}. Надеюсь, это помогает кому-то вроде меня.

Answer 6

Для V 0.9.9:.

this.currItem.el