Question

 <div class="speaker">
        <a id="performer1"  class="html-popup" href="<?php echo get_stylesheet_directory_uri();?>/performer-detail.php">                    </a> 
</div>

我有这个锚点标签，其点击弹出窗口将打开。锚点的ID需要在以下js中动态传递，代替#performer1

 jQuery('.speaker a').click(function(e){
            var currentID = jQuery(this).attr("id");
        })
        jQuery('.speaker a').magnificPopup({type: 'ajax',
            callbacks: {
              parseAjax: function(mfpResponse) {
                // mfpResponse.data is a "data" object from ajax "success" callback
                // for simple HTML file, it will be just String
                // You may modify it to change contents of the popup
                // For example, to show just #some-element:
                mfpResponse.data = $(mfpResponse.data).find('#performer1');

                // mfpResponse.data must be a String or a DOM (jQuery) element

                console.log('Ajax content loaded:', mfpResponse);
              },
              ajaxContentAdded: function() {
                // Ajax content is loaded and appended to DOM
                console.log(this.content);
              }
            }
        });

我使用以下代码在其点击

上获取<a>的ID

 jQuery('.speaker a').click(function(e){
                var currentID = jQuery(this).attr("id");
            })

但我如何传递此currentID

Answer 1

使用此代码可以解决问题

jQuery('.speaker a').magnificPopup({type: 'ajax',
        callbacks: {
          parseAjax: function(mfpResponse) {
            // mfpResponse.data is a "data" object from ajax "success" callback
            // for simple HTML file, it will be just String
            // You may modify it to change contents of the popup
            // For example, to show just #some-element:
            var mp = $.magnificPopup.instance,
            t = $(mp.currItem.el[0]);

            var h=( t.data('custom') );

            mfpResponse.data = $(mfpResponse.data).find('#'+h);

            // mfpResponse.data must be a String or a DOM (jQuery) element

            console.log('Ajax content loaded:', mfpResponse);
          },
          ajaxContentAdded: function() {
            // Ajax content is loaded and appended to DOM
            console.log(this.content);
          }
        }
    });

Answer 2

首先使用 window.currentID; 创建变量，而不是在click事件中。使其成为全球

更改点击事件功能：

jQuery('.speaker a').click(function(e){
currentID = jQuery(this).attr("id");

        })

以及最后一行更改：

 mfpResponse.data = $(mfpResponse.data).find('#' +  currentID);

Answer 3

试试这个..

全局声明变量currentID。
将.find('#performer1')替换为.find('#'+currentID)。

这是更新的代码。

var currentID;
jQuery('.speaker a').click(function(e) {
  currentID = jQuery(this).attr("id");
});
jQuery('.speaker a').magnificPopup({
  type: 'ajax',
  callbacks: {
    parseAjax: function(mfpResponse) {
      // mfpResponse.data is a "data" object from ajax "success" callback
      // for simple HTML file, it will be just String
      // You may modify it to change contents of the popup
      // For example, to show just #some-element:
      mfpResponse.data = $(mfpResponse.data).find('#' + currentID);

      // mfpResponse.data must be a String or a DOM (jQuery) element

      console.log('Ajax content loaded:', mfpResponse);
    },
    ajaxContentAdded: function() {
      // Ajax content is loaded and appended to DOM
      console.log(this.content);
    }
  }
});

无法在大量弹出窗口

3 个答案: