javascript - jQuery - Run a function after .load() is complete AND DOM is updated - Stack Overflow

admin管理员组

文章数量:1425863

I'm trying to run a function on an object that is loaded into the DOM when the user clicks on the menu. Here is some part of my code:

$('#menu li a').click(function(){  
            var toLoad = $(this).attr('href');
            //...

            var $newItem = $('<li></li>').appendTo($(columns).first());

            loadContent();
            function loadContent() {
                $newItem.load(toLoad, runScript());
            }

            function runScript() {
                //see the code in IE9's debugger
                alert($newItem.get(0).outerHTML);
                obj.doWidget($newItem.get(0));
            }

            return false;
        });

The problem is, when I click on the menu item, the alert function in the above code, shows the code before loading: <li></li> and not the loaded element from the object itself hence the script changes the old object and the new object overwrites its content. (like I've never ran the script). I assumed that the fallback function should implement return the loaded object. How can I get that object? Thanks.

I'm trying to run a function on an object that is loaded into the DOM when the user clicks on the menu. Here is some part of my code:

$('#menu li a').click(function(){  
            var toLoad = $(this).attr('href');
            //...

            var $newItem = $('<li></li>').appendTo($(columns).first());

            loadContent();
            function loadContent() {
                $newItem.load(toLoad, runScript());
            }

            function runScript() {
                //see the code in IE9's debugger
                alert($newItem.get(0).outerHTML);
                obj.doWidget($newItem.get(0));
            }

            return false;
        });

The problem is, when I click on the menu item, the alert function in the above code, shows the code before loading: <li></li> and not the loaded element from the object itself hence the script changes the old object and the new object overwrites its content. (like I've never ran the script). I assumed that the fallback function should implement return the loaded object. How can I get that object? Thanks.

• javascript
• jquery
• html

Share Improve this question Follow asked Nov 12, 2011 at 16:48 Alireza NooriAlireza Noori 15.3k3030 gold badges102102 silver badges190190 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

Pass a reference to runScript not the results of executing the function:

$newItem.load(toLoad, runScript);

本文标签： javascriptjQueryRun a function after load() is complete AND DOM is updatedStack Overflow