Question

我正在使用由某些js运行的垂直下拉菜单或手风琴菜单。为了保持菜单不变，并防止它在加载某些内容时回到它的初始状态，我正在使用加载功能。这似乎工作:-) 但是实际内容，一个图像滑块，也使用了一些js，当通过函数加载时，js不会触发，因为整个站点不会再次出现。如何重新触发该内容的js？

这是加载功能：

$(document).ready(function() {
    $('ul#menu2 li ul li a').click(function() {
        var page = $(this).attr('href');
        $('#content').load(page + '.php');
       return false;
    })
;});

这是滑块的连接

$(document).ready(function() {
    // Using default configuration
    $('#carousel').carouFredSel();

    // Using custom configuration
    $('#carousel').carouFredSel({

        items               : 1,
        direction           : "left",
        responsive          : false,
        auto : {
            play            : false
        },
        scroll : {
            items           : 1,
            easing          : "swing",  // "elastic", "swing"
            duration        : 500,                         
        },
        prev    : {
            button  : "#p",
            key     : "left"
        },
        next    : {
            button  : "#n",
            key     : "right"
        },               
    });});

滑块的js称为 jquery.carouFredSel-6.2.1.js 。我想这个和连接需要重新触发才能使滑块工作只加载内容而不是整个页面。

任何人都可以帮我吗？

Answer 1

拨打$（＆＃39;＃carousel＆＃39;）。carouFredSel（）;来自ajax请求的回调函数。像这样的东西。

$( "#result" ).load( "ajax/test.html", function() {
  alert( "Load was performed." );
});

Answer 2

他们的文档中有一节用于在初始化后将项目插入到轮播中：

http://docs.dev7studios.com/jquery-plugins/caroufredsel-advanced#insertitem

$(document).ready(function()    {
    $('ul#menu2 li ul li a').click(function() {
        var page = $(this).attr('href');
        $('#content').load(page + '.php', function(){
            $('#carousel').carouFredSel({ 
               'insertItem' : $('#content') // Or whatever you need to add 
            });
        });
        return false;
    });
});

Answer 3

也许

$(document).ready(function() {
    $('ul#menu2 li ul li a').click(function(e) {
        e.preventDefault();    // Prevents the browser from navigating to wherever the href was leading to

        var page = $(this).attr('href');
        $('#content').load(page + '.php', function() {
            // Loads Carousel only after #content has fully loaded
            $('#carousel').carouFredSel({
                items               : 1,
                direction           : "left",
                responsive          : false,
                auto : {
                    play            : false
                },
                scroll : {
                    items           : 1,
                    easing          : "swing",  // "elastic", "swing"
                    duration        : 500,                         
                },
                prev    : {
                    button  : "#p",
                    key     : "left"
                },
                next    : {
                    button  : "#n",
                    key     : "right"
                },               
            });
        });

        return false;
    });
});

AJAX加载后如何运行JavaScript？

3 个答案: