Question

基本上我正在尝试将内容从div中的链接加载到div中。现在它在某种程度上有效。到目前为止，我的代码从目标div获取链接，然后单击动画“内容”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;  

});

第一个问题是，在隐藏旧内容之后，在显示新内容时，动画不稳定，并且OLD内容仍然可见并且动画直到最后一个毫秒时新内容才“闪烁”。旧内容隐藏，新内容显示？我试着用.empty解决这个问题，但现在只是轻轻一点，好像根本没有.show动画。

第二个问题是，我的任何代码似乎唯一影响的链接是目标div中的标题链接，'content' 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;  


});  

});

Jquery。显示没有正确动画，也没有抓住目标中的所有链接

1 个答案: