没有通过AJAX加载并且给出' XMLHttpRequest的Magnific popup无法加载'错误?

时间:2016-01-26 07:39:57

标签: javascript jquery html ajax magnific-popup

我试图通过AJAX使用Magnific创建一个弹出页面但是得到一个' XMLHttpRequest无法加载'单击链接按钮时出错。

以下是投资组合部分的部分代码,其中点击按钮应加载project_1.html



<div class="masonry_items removeImgGrayFilter  portfolio_items catFilterEffect_1 ajaxPopup_gallery" data-animated-time="15" data-animated-in="animated fadeIn" data-animated-innerContent="yes" data-anchor-to="parent.parent.parent">

  <div class="grid-sizer"></div>
  <div class="gutter-sizer"></div>

  <!-- Category 1 - jQuery  -->
  <!-- Thumbnail -->
  <div class="item width_1by4 hover_enable cat1 selPopup">

    <div class="item_thumbnail">
      <div class="porImgOver">
        <!-- Thumbnail Image -->
        <img class="preload" src="images/0.png" data-src="images/portfolio/thumb1.jpg" alt="image_alt_text" />
      </div>

      <div class="imageText textOnHover">
        <div class="text_field lightColorText">
          <h5>Bloc Jams - jQuery</h5>
          <h6>A fully functional digital music player similar to Spotify</h6>

          <a class="detail_btn ajaxPopup_galItem" href="project_1.html">
            <span class="icon"><i class="fa fa-search-plus"></i></span> 
          </a>
        </div>
      </div>

      ....
      
<script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="js/jquery.magnific-popup.min.js"></script>
<script type="text/javascript" src="js/custom.min.js"></script>
&#13;
&#13;
&#13;

custom.min.js

&#13;
&#13;
// magnificPopup plugin Initialization 
try {
  //Initialize Image
  $('.magnificPopup').each(function() {
    var mc = $(this);
    var tit = mc.attr("data-title") !== undefined ? "data-title" : "title";
    var typ = mc.attr("data-type") !== undefined ? mc.attr("data-type") : "image";
    mc.magnificPopup({
      image: {
        titleSrc: tit
      },
      type: typ,
      removalDelay: 500, //delay removal by X to allow out-animation
      callbacks: {
        change: function() {
          this.content.addClass("animated fadeInLeft");
        },
      },
      closeOnContentClick: false,
      closeBtnInside: true,
      midClick: false // allow opening popup on middle mouse click. Always set it to true if you don't provide alternative source.
    });
  });
} catch (e) {}

try {
  //Initialize Gallery
  $('.magnificPopup_gallery').each(function() { // the containers for all your galleries
    $(this).magnificPopup({
      delegate: 'a', // the selector for gallery item
      type: 'image',
      gallery: {
        enabled: true
      },
      callbacks: {
        change: function() {
          this.content.addClass("animated fadeInLeft");
        },
      },
      closeOnContentClick: false,
      midClick: true, // allow opening popup on middle mouse click. Always set it to true if you don't provide alternative source.
    });
  });
} catch (e) {}

try {
  // Initialize portfolio item gallery
  $('.magnificPopup_item_gallery').each(function() {
    var mc = $(this);
    var p_items = [];
    mc.find(".i_gallery").children().each(function() {
      var mc2 = $(this);
      var tit = mc2.attr("data-title") !== undefined ? mc2.attr("data-title") : mc2.attr("title");
      p_items.push({
        src: mc2.attr("data-href"),
        title: tit,
        type: mc2.attr("data-type")
      });
    });
    mc.magnificPopup({
      items: p_items, // the selector for gallery item
      type: 'image', // this is default type
      removalDelay: 500, //delay removal by X to allow out-animation
      gallery: {
        enabled: true
      },
      callbacks: {
        change: function() {
          this.content.addClass("animated fadeInLeft");
        },
      },
      closeOnContentClick: false,
      midClick: true // allow opening popup on middle mouse click. Always set it to true if you don't provide alternative source.
    });
  });
} catch (e) {}

try {
  // Initialize inline content
  $('.magnificPopup_inline').magnificPopup({
    type: 'inline',
    callbacks: {
      change: function() {
        this.content.addClass("animated fadeInLeft");
      },
    },
    closeOnContentClick: false,
    midClick: true // allow opening popup on middle mouse click. Always set it to true if you don't provide alternative source.
  });
} catch (e) {}


try {
  // Initialize popup detail text	
  $('.detail_text').each(function() {
    var cont = $(this).find(".popup_text");
    $(this).find(".link_btn").magnificPopup({
      items: {
        src: cont,
        type: 'inline'
      },
      removalDelay: 500, //delay removal by X to allow out-animation	
      closeOnContentClick: false,
      midClick: true // allow opening popup on middle mouse click. Always set it to true if you don't provide alternative source.
    });
  });
} catch (e) {}


$('.ajaxPopup_link').magnificPopup({
  type: 'ajax',
  settings: null,
  alignTop: false,
  cursor: 'mfp-ajax-cur',
  closeOnContentClick: false,
  closeBtnInside: true
});


try {
  //Initialize Gallery
  $('.ajaxPopup_gallery').each(function() { // the containers for all your galleries
    $(this).magnificPopup({
      delegate: '.selPopup a.ajaxPopup_galItem', // the selector for gallery item
      type: 'ajax',
      settings: null,
      alignTop: true,
      cursor: 'mfp-ajax-cur',
      gallery: {
        enabled: true
      },
      closeOnContentClick: false,
      midClick: true, // allow opening popup on middle mouse click. Always set it to true if you don't provide alternative source.
    });
  });
} catch (e) {}
&#13;
&#13;
&#13;

0 个答案:

没有答案