2011-11-16 41 views
0

我使用simple modal来了解jQuery模式如何工作。通过该处理在jQuery模式中显示外部文件的内容

var load = 'alert.html'; // THE PURPOSE OF THIS QUESTION IS TO CHANGE "alert.html" to "image.jpg" 
$(this).click(function(e) { 
    e.preventDefault(); 
    $('body').append('<div id="overlay" />'); 
    $('#overlay').fadeIn(300, function() { 
     $('body').append('<div id="alertModalOuter"><div id="alertModal"></div></div>'); 
     var outer = $('#alertModalOuter'); 
     var modal = $('#alertModal'); 
     var defWidth = outer.outerWidth(); 
     var defHeight = outer.outerHeight(); 
     modal.load(load + ' #alert', function() { 
      var alertBoxContent = $('#alert'); 
      var alertWidth = alertBoxContent.outerWidth(); 
      var alertHeight = alertBoxContent.outerHeight(); 
      var widthCombine = -((defWidth + alertWidth)/2); 
      var heightCombine = -((defHeight + alertHeight)/2); 
      modal.animate({width: alertWidth, height: alertHeight}, 200); 
      outer.animate({marginLeft: widthCombine, marginTop: heightCombine}, 200, function() { 
       alertBoxContent.fadeIn(200, function() { 
       }); 
      }); 
     }); 

这附加的外部文件来(从load)到模式窗口的内容;但这只适用于id =“alert”标签内的内容。如何删除“警报”角色以显示外部文件的全部内容。例如,我想加载一个外部图像(这是一个图像文件,而不是“alert”标签)。

回答

1

您不必指定#alert选择器,它将加载整个页面。值得注意的是,如果您不指定选择器,则在删除它们之前加载调用.html()并处理所有脚本。您可能正在运行一些脚本,从而为您提供意外的结果The .load() docs

+0

你的意思是简单地用'modal.load(load,function(){var alertBoxContent = $();'''修改代码这是我做的第一件事,但没有奏效! – Googlebot

相关问题