Magnificent Popup을 열 때 AJAX 호출에 $ (this) .data() 포함하기

Question

Magnificent Popup을 열 때 data 개체를 AJAX 요청으로 보내려고합니다. 그러나 $(this)이 플러그인 내에서 올바르게 번역되지 않는 것 같습니다. 데이터 오브젝트가 제대로 반환되지 않습니다

<div class="my-div"> 
    <a href="/path/to/file.php" data-name="John" data-location="Boston">Click here</a> 
</div> 

$('.my-div a').magnificPopup({ 
    type: 'ajax', 
    ajax: { 
    settings: { 
     data: $(this).data() 
    } 
    } 
}); 

:

이 코드를 생각해 보자. 나는이와 데이터 라인을 교체하는 경우에는 :

data: { name: "John", location: "Boston" } 

는 다음 나는 $_GET에 그 객체를 참조 할 수 있어요.

---

편집 : 아직 아무 것도 반환하지 않습니다

data: { href: $(this).attr('href') } 

:이 $(this)가 magnificPopup 내에서 제대로 작동하지 않는 사실을 촉진하기 위해, 나는에 데이터 라인을 변경했습니다. 내가했던

---

모든 플러그인 내에서 존중되지 $(this) 가리 것으로 보인다. 어떻게 원래 앵커 태그에서 data 개체를 가져와 AJAX 요청에 전달할 수 있습니까?

Answer 1

$('.my-div a').magnificPopup({ 
     type: 'ajax', 
     elementParse: function(item) { 
      this.st.ajax.settings = item.el.data(); 
     } 
}); 

Answer 2

직접 호출하는 대신 단순히 클릭에 아약스 요청을 호출이

data: { name:$(this).data('name'), location:$(this).data('location') } 

Answer 3

내가 데이터로 아약스 응답을 호출하는 가장 좋은 방법은 요청에 속성 것으로 나타났습니다한다 시도 할 수 있습니다 magnificpopup. 그런 다음 표준 인라인 mfp에 응답을 삽입하기 만하면됩니다.

$('a.popup').magnificPopup({ 
    type: 'ajax', 
    ajax: { 
     settings: { 
      type: "POST", 
      url: '/ajax.php', 
      data: { 
       action : 'ajax_action', 
       postid : this.currItem.el.data('id') 
       // this doesn't actually work because 'this.currItem' 
       // is only accessible in a callback 
      } 
     } 
    } 
}); 

대신이 작업을 수행 :

$('a.popup').click(function(){ 
    $.ajax({ 
     type: "POST", 
     url: '/ajax.php', 
     data: { 
      action : 'ajax_action', 
      postid : $(this).data('id'), 
      //$(this).data() works because it's a standard AJAX call 
     }, 
     success: function(data){ 
      $.magnificPopup.open({ 
       type: 'inline', 
       items: { 
        src: data 
       } 
      }) 
     } 
    }); 
});