我有一个JQuery函数/脚本,我用于博客上的帖子,在帖子图像悬停时显示帖子标题,摘录和链接。
此外,我还有一个运行AJAX Fade Out / Fade In分页脚本,当我进入分页中的下一组帖子时,第一个JQuery脚本不再运行。我知道我需要以某种方式使用.live函数为jQuery,但我似乎无法弄明白。这是两个脚本。
<script type="text/javascript">
$(function() {
$(".capslide_img").capslide({
caption_color : '#516077',
caption_bgcolor : '#dbe2f0',
overlay_bgcolor : '#dbe2f0',
border : '4px solid #dbe2f0',
showcaption : false
});
});
</script>
<script type="text/javascript" charset="utf-8">
jQuery(document).ready(function(){
jQuery('#postPagination a').live('click', function(e){
e.preventDefault();
var link = jQuery(this).attr('href');
jQuery('#page-wrap').fadeOut(500).load(link + ' #contentInner', function(){ jQuery('#page-wrap').fadeIn(500); });
});
});
</script>
感谢您的帮助。
答案 0 :(得分:2)
您可以将capslide
命令放入函数中,并在每次ajax加载后调用它:
function addCappslide() {
$(".capslide_img").capslide({
caption_color : '#516077',
caption_bgcolor : '#dbe2f0',
overlay_bgcolor : '#dbe2f0',
border : '4px solid #dbe2f0',
showcaption : false
});
}
$(function() {
addCappslide(); // call it once the page has loaded
$('#postPagination a').live('click', function(e){
e.preventDefault();
var link = $(this).attr('href');
$('#page-wrap').fadeOut(500).load(link + ' #contentInner', function(){
jQuery('#page-wrap').fadeIn(500, addCappslide() ); // call it after each ajax load again after it faded in
});
});
});