0

...我有一段简单的 jQuery 代码可以加载到外部页面中:

$(document).ready(function(){

    $('#info a').click(function(){

        var href = $(this).attr('href');

        $('#info_show').load(href).fadeToggle();

        return false;

    });
});

加载页面后,我想运行一个将这些内容集中到窗口中的函数......

$(document).ready(function(){

    $('#info').click(function(){

        var href = $(this).attr('href');

        $('#info_show').load(href).fadeToggle();

        return false;

        function move_div(){

            window_width = $(window).width();
            window_height = $(window).height();

            obj_width = $('#holder').width();
            obj_height = $('#holder').height();

            $('#holder').css('top', (window_height / 2) - (obj_height / 2)).css('left', (window_width / 2) - (obj_width / 2));

        }

        $(window).resize(function(){

            move_div();

        });

    });

});

...“move_div”不运行...任何人都可以帮助解决这个问题...?

4

2 回答 2

1

.load 函数接受一个回调参数,该参数将被调用:

...在执行后处理和 HTML 插入之后。\

请参阅:.load( url [, data ] [, complete(responseText, textStatus, XMLHttpRequest) ])

更新了移动返回并添加move_div为加载完成回调的代码:

$('#info').click(function(){

    var href = $(this).attr('href');

    function move_div(){

        window_width = $(window).width();
        window_height = $(window).height();

        obj_width = $('#holder').width();
        obj_height = $('#holder').height();

        $('#holder').css('top', (window_height / 2) - (obj_height / 2)).css('left', (window_width / 2) - (obj_width / 2));
    }

    $(window).resize(function(){
        move_div();
    });

    // Add move_div as the load complete callback
    $('#info_show').load(href, move_div).fadeToggle();

    return false;
});
于 2013-08-18T16:18:01.153 回答
0

You have a return statement before the declaration of the function. So it is probable that the move_div() function never gets executed.

Try this:

$(document).ready(function(){
    $('#info').click(function(){
        var href = $(this).attr('href');
        $('#info_show').load(href).fadeToggle();

        function move_div(){
            window_width = $(window).width();
            window_height = $(window).height();
            obj_width = $('#holder').width();
            obj_height = $('#holder').height();
            $('#holder').css('top', (window_height / 2) - (obj_height / 2)).css('left', (window_width / 2) - (obj_width / 2));

        }
        $(window).resize(function(){
            move_div();
        });
        return false;
    });
});
于 2013-08-18T16:13:10.720 回答