javascript - How to access data within an iframe? - Stack Overflow

admin2025-04-26 0

I have been trying to access data from an iframe. I am working on codeigniter. I have spent my whole day searching for the solution, but no luck. I am not an expert in javascript, so it is being more difficult to me. Please have a look at my code.

home-upload-dialog.php view file

<div id="popup-contents">
    <iframe id="upload-frame" frameborder="0" scrolling="no" height="200" width="100%" src="<?php echo site_url('home/upload_area/' . $_REQUEST['count']);?>"></iframe>
</div>
<input type="button" value="click me" onclick="run()">
<script>
    run() {
        var iframedoc = document.getElementsByTagName('iframe')[0].contentWindow.document;
        var inputs = iframedoc.getElementById('text');
        console.log(inputs);
    }
</script>

home.php controller

upload_area() {
    $data['count'] = $count;
    $this->load->view('upload-area', $data);
}

upload-area.php view file

<!DOCTYPE html>
    <html>
    <head>
        <title>Title here</title>
    </head>
    <body>
        <input type="text" name="text" id="text" value="someValue">
    </body>
    </html>

I get the error saying Uncaught TypeError: Cannot read property 'contentWindow' of undefined There might be things I overlooked. Any help would be appreciated !

I also tried $('iframe').contents().find('#text').html(); but no luck.

home-upload-dialog.php view file

<div id="popup-contents">
    <iframe id="upload-frame" frameborder="0" scrolling="no" height="200" width="100%" src="<?php echo site_url('home/upload_area/' . $_REQUEST['count']);?>"></iframe>
</div>
<input type="button" value="click me" onclick="run()">
<script>
    run() {
        var iframedoc = document.getElementsByTagName('iframe')[0].contentWindow.document;
        var inputs = iframedoc.getElementById('text');
        console.log(inputs);
    }
</script>

home.php controller

upload_area() {
    $data['count'] = $count;
    $this->load->view('upload-area', $data);
}

upload-area.php view file

<!DOCTYPE html>
    <html>
    <head>
        <title>Title here</title>
    </head>
    <body>
        <input type="text" name="text" id="text" value="someValue">
    </body>
    </html>

I get the error saying Uncaught TypeError: Cannot read property 'contentWindow' of undefined There might be things I overlooked. Any help would be appreciated !

I also tried $('iframe').contents().find('#text').html(); but no luck.

Share Improve this question edited Oct 16, 2016 at 13:52 asked Oct 16, 2016 at 13:18 Rabin Lama Dong 2,4761 gold badge28 silver badges34 bronze badges

1 Possible duplicate of How can I access iframe elements with Javascript? – Charlotte Dunois Commented Oct 16, 2016 at 13:27
I already visited that page and still have the same problem. – Rabin Lama Dong Commented Oct 16, 2016 at 13:33
Just a tip, I tried to fix an issue with a webinterface (which uses frames) a few days ago, I used window.frames['name_of_the_frame'].document – Charlotte Dunois Commented Oct 16, 2016 at 13:36
It still says cannot read property 'document' of undefined There might be small silly mistakes in my codes. But I have tried many options with no result. – Rabin Lama Dong Commented Oct 16, 2016 at 13:43
1 Your iframe needs to have a name attribute. – Charlotte Dunois Commented Oct 16, 2016 at 13:44

| Show 1 more ment

1 Answer 1

Sorted by: Reset to default 3

There are already many answers to your questions, google "access DOM inside iframe" for several solutions, here is one.

In general remember that you cannot access the iframe data if the iframe is loaded on another domain for security reasons (otherwise imagine the "Like" widget from Facebook, you could load it and then steal the authorization cookie of the users visiting your website...)

EDIT: Note that the security limitation above includes funny situations like your website is loaded from "www.domain./page.php" and your iframe from "domain./iframe.php", so check that out.

转载请注明原文地址:http://conceptsofalgorithm.com/Algorithm/1745642947a311706.html

javascriptHow to access data within an iframeStack Overflow

最新回复(0)