我有一个关于jquery的非常基础的问题。然而,我不知道怎么做,所以我在这里寻求您的帮助。这是我的代码:
编辑: <a href="javascript:$('#target').load('page.html').fadeIn('1000');">Link</a>
如您所见,我想将page.html加载到名为#target的div中。我还想做的事情是使page.html在加载时淡入,但它并没有起作用。正确的方法是什么?
最好的问候
首先,您应该将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>
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>
preventDefault
更好。 - lonesomeday