Jquery .show没有正确地显示动画并且没有抓取目标中的所有链接

Question

基本上我试图加载内容到一个div，从该div内的链接。现在它的工作到一定程度。到目前为止，我的代码从目标div中获取链接，然后单击将"content"div动画化并替换为目标链接中的"content"div。

//Target links and call on click
$('#scrollbox li a').click(function(){  
//Define load paramaters
var toLoad = $(this).attr('href')+' #content';  
//Hide content
$('#content').hide('fast',loadContent);
//Remove Load Bar 
$('#load').remove(); 
//Show Load Bar
$('#wrapper').append('<span id="load">LOADING...</span>');  
$('#load').fadeIn('normal');

function loadContent() {  
    $('#content').empty().load(toLoad,'',showNewContent())  
}  
function showNewContent() {  
    $('#content').show('slow',hideLoader());  
}  
function hideLoader() {  
    $('#load').fadeOut('normal');  
}  
return false;  
});  

第一个问题是，隐藏旧内容后，在显示新内容时，动画是不稳定的，旧内容仍然可见并动画，直到最后一毫秒新内容才"闪现"进来。旧内容不应该隐藏而新内容不应该显示吗?我试着用。empty来修复这个问题，但现在它只是弹进来，好像根本没有。show动画。

第二个问题是，我的任何代码似乎有影响的唯一链接是标头链接在目标div，"内容"div内的链接(在目标div内)不受影响，并重新加载整个页面。我需要在div中设置div的目标吗?我不是在我的代码div内的所有链接?

如果您需要进一步的说明，请告诉我。

谢谢你的帮助。

Answer 1

修复。将动画设置为0，这样就没有动画了。(这是一种廉价的修复)

使用.live()命令将命令绑定到所有后续的链接。

$(document).ready(function(){
$('.scroll-pane').jScrollPane({showArrows: true});
$('#scrollbox a').live('click', function() {
//all elements that exist now and elements added later
//with this class have this click event attached
//Define load paramaters
var toLoad = $(this).attr('href')+' #content';  
//Hide content
$('#content').hide(0,loadContent);
function loadContent() {  
    $('#content').load(toLoad,'',showNewContent())  
}  
function showNewContent() {  
    $('#content').fadeIn(0);  
}  
return false;  

});  
});