Question

///////////////////////////

这对我来说真的是一个糟糕的方法。经过大量调整后，我得出的结论是，最好一次加载所有外部元素（html）并仅在点击时应用fadeIn效果，而不是同时尝试加载外部页面。以下方法没有导致平滑的淡入淡出效果＆amp;外部页面加载时导致延迟。

///////////////////////////

我正在通过以下方式加载外部页面：

$('a').click(function() {
$('#result').load($(this).attr('href'));

return false;
});

我正在尝试使用fadeIn加载外部页面。

我看了其他答案，但没有一个适合我。也许我没有正确理解答案或者错误地应用它。我的最大努力（经过无数次的尝试）到目前为止，但这在div #one中消失然后只是加载#load。（我这样做是因为我明白我不能将淡化效果应用于加载div本身。）

$("a").click(function () {
$("#one:hidden:first").fadeIn("slow");
$('#load').load($(this).attr('href'));

return false;
});

我是jQuery的新手，除了我之外，对于其他所有人来说，这可能是非常简单的。

我真的很感激任何帮助。感谢。

这是标记///////////////////

<a href="./test.html" class="link">Load Page 1</a>

<div id="one">

<div id="load">load here</div>


</div>

/////////////////////////////////////////////// //////////////

Answer 1

<a href="./test.html" class="link">Load Page 1</a>

<div id="one" class="slot">
  <div id="load">load here</div>
</div>

最初隐藏div

.slot{
 display:none;
}

加载外部内容

   $(".link").click(function (e) {
     e.preventDefault();      
    var $urlToLoad = $(this).attr('href');  
    $('#load').load($urlToLoad, function(data){
        $("#one").fadeIn('slow');
    });      
});

DEMO

使用.click时，无法使用.fadeIn加载外部页面

1 个答案: