脚本 JQuery Gallery，将 CSS 类作为函数的参数传递

Question

您好，我是 javascript/编程新手，我无法为负责为每个照片库提供参数的脚本找到合理的解决方案。该脚本运行良好，但正如我所写，我认为它可以简化为不重复参数。每个图库脚本中只有一个参数（类选择器）发生变化。

$(document).ready(function() {
      $('.popup-gallery-wakipo').magnificPopup({ // HERE THE CLASS SELECTOR
        delegate: 'a.gallery_portf',
        type: 'image',
        tLoading: 'Loading image #%curr%...',
        mainClass: 'mfp-img-mobile',
        gallery: {
          enabled: true,
          navigateByImgClick: true,
          preload: [0,1]
        },
        image: {
          tError: '',
          titleSrc: function(item) {
            return item.el.attr('title') + '';
            }
        }
      });


      $('.popup-gallery-instacash').magnificPopup({ // HERE THE CLASS SELECTOR
        delegate: 'a.gallery_portf',
        type: 'image',
        tLoading: 'Loading image #%curr%...',
        mainClass: 'mfp-img-mobile',
        gallery: {
          enabled: true,
          navigateByImgClick: true,
          preload: [0,1]
        },
        image: {
          tError: '',
          titleSrc: function(item) {
            return item.el.attr('title') + '';
          }
        }
      });

等等……

所以问题是如何模块化这个脚本，只将类选择器作为参数传递。也许使用对象构造器/方法，我已经尝试过，但我迷失了让它工作

  function Gallery (theclass){

    $('.' + theclass).magnificPopup({
      delegate: 'a.gallery_portf',
      type: 'image',
      tLoading: 'Loading image #%curr%...',
      mainClass: 'mfp-img-mobile',
      gallery: {
        enabled: true,
        navigateByImgClick: true,
        preload: [0,1]
      },
      image: {
        tError: '',
        titleSrc: function(item) {
          return item.el.attr('title') + '';

        }
      }
    });

  }

  var mySecondGallery = new Gallery("popup-gallery-wakipo");

  mySecondGallery ();

Answer 1

试试这个：

function gallery(class) { 
  return $("." + class).magnificentPopup({
  ...
  });
}
var mySecondGallery = gallery("popup-gallery-wakipo");

然后您就可以访问 jQuery 对象了。