Question

我有一个关于jquery的基本问题。但是我不知道怎么回事这就是为什么我在这里寻求你的帮助。这是我的代码：

修改： <a href="javascript:$('#target').load('page.html').fadeIn('1000');">Link</a>

如您所见，我想将page.html加载到名为#target的div中。我还想做的事情就是让page.html在加载时淡入淡出。什么是正确的方法？

最好的问候

Answer 1

首先，您应该将您的Javascript代码放在元素本身之外。这很简单。它使您的HTML和Javascript更容易理解，并最终允许更有组织的代码。首先，将a元素设为id：

<a href='#' id='loadPage'>Link</a>

然后使用script标记进行通话：

<script type="text/javascript">
    $(document).ready(function() { // when the whole DOM has loaded
        $('#loadPage').click(function(){ // bind a handler to clicks on #loadPage
            $('#target')
                .hide() // make sure #target starts hidden
                .load('page.html', function() {
                    $(this).fadeIn(1000); // when page.html has loaded, fade #target in
                });
        });
    });
</script>

修改要发表评论，是的，您可以使用a代码中的网址，然后使用this.href。

<a href='page.html' id='loadPage'>Link</a>
<script type="text/javascript">
    $(document).ready(function() {
        $('#loadPage').click(function(e){
            e.preventDefault();
            $('#target')
                .hide()
                .load(this.href, function() {
                    $(this).fadeIn(1000);
                });
        });
    });
</script>

Answer 2

尝试

$('#target').load('page.html',{},function(){$('#target').fadeIn(1000)});

load有一个完整的处理程序（see doc）

淡入jquery加载调用

2 个答案: