开发者

How can I access the functions wrapped in the $(document).ready(function(){}) of an iframe?

So I have an iframe that has some functions wrappe开发者_如何转开发d in a $(document).ready(function(){}) like this.

<script>
    $(document).ready(function(){
        function foo(){
            // do some stuff
        }
    });
</script>

I know that I can access the DOM with something like $('iframe').contents().find('something'), but can I access the foo() function from above?


You cannot access the variables in that ready function of the iframe for the same reason that you cannot access local variables of any other function (you can't "go down" in scope). If you can modify the code in the iframe, however, you can always go up in scope. So in your iframe code:

$(document).ready(function() {
    function func1() {
        alert("Function in iframe");
    }

    parent.iframeFunctions = {
        test: func1
    }
});

The next problem is that you need to be able to access the function. You cannot use the normal jquery document ready, because the iframe is not finished loading when the parent page's DOM is ready and therefore your iframeFunctions object is still undefined in the parent page. You need this:

$(window).load(function() {
    iframeFunctions.test();
});

You can, however, access the global space of the iframe. Oh yeah, so far this is all assuming that the iframe source falls within the same domain policy. If not, there's a lot more work involved, and in a lot of cases it's not even worth it. The jquery object, for example, is in the global space, so here's how you get at the iframe's jquery:

$("iframe")[0].contentWindow.$("#divInIframe")

So, if you modified the content of the iframe source to use function expressions rather than function declartions:

var func1 = function() {
    alert("Function in iframe");
}

$(document).ready(function() {
    func1();
});

You'd be able to access it from the parent as well (after the window load event has fired):

$(window).load(function() {
    $("iframe")[0].contentWindow.func1();
});


You can't. foo is a local variable and can't be seen from anywhere else (imagine if you could access index variables like i and other local variables from outside their scope!).

If you can change the code in the iframe:

1) You could turn foo global.

$(document).ready(function(){
    foo = function(){
        //this alternate syntax declares a global function foo
        //it is very evil so be sure you really need this
        ...
    };
})

or if foo does not use any inner variables it could have been declared outside in the

first place...

function foo(){
    ...
};

$(document).ready(function(){

})

2) You could pass foo as an argument to those who need it (just like you have to do with any other local variable)

$(document).ready(function(){
    function foo(){
        //this alternate syntax declares a global function foo
        //it is very evil so be sure you really need this
        ...
    };

    function_that_uses_foo();
})

function_that_uses_foo(){
    foo(); //foo is not on cope, this doesnt work!
}

becomes

$(document).ready(function(){
    function foo(){
        //this alternate syntax declares a global function foo
        //it is very evil so be sure you really need this
        ...
    };

    function_that_uses_foo(foo);
})

function_that_uses_foo(his_foo){
    his_foo();
}

If you can't change the iframe then you will need to copy-paste the function code, if that even halps after all.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜