Why an iframe's section cannot be jumped to?

HTML-CSS
1

I have two html files, main.html and iframe.html, and I need to display iframe.html inside main.html as an iframe and main.html is the page I want to stay on:

main.html

<body>
    <a href="iframe.html#goto" target="tableB" class="btn btn-secondary">Find</a>
    <table class="table">
        <thead>
            <tr>
                <th scope="col">First Name</th>
                <th scope="col">Last Name</th>
            </tr>
        </thead>
        <tbody>         
            <tr>
                <td>John</td>
                <td>Citizen</td>
            </tr>
            <!-- 100 items more -->
        </tbody>
    </table>

    <iframe name="tableB" src="iframe.html" width="100%" height="1000"></iframe>
</body>

iframe.html

<body>
    <table class="table">
        <thead>
            <tr>
                <th scope="col">First Name</th>
                <th scope="col">Last Name</th>
            </tr>
        </thead>
        <tbody>         
            <tr>
                <td>...</td>
                <td>...</td>              
            </tr>  
            <!-- 50 items more -->
            <tr id="goto">
                <td>Alice</td>
                <td>Smith</td>
            </tr>
            <!-- 50 items more -->
        </tbody>
    </table>
</body>

what I want to achieve is, when I click the <a> link, the current page should jump to the the iframe’s Alice Smith record, and I don’t want to open another page for indexB.html to display, I just want to display it in main.html and do the jump in main.html

But it doesn’t work when I click the link button, it doesn’t jump to the correct section which is the iframe’s Alice Smith record, where did I do wrong? I did exactly the same in Need help with iframe and jumping to topic

2

Hello,
One solution I know of is to set an id attribute on the iframe you want to jump to, then add the value of that id attribute to the href attribute of the link element and it should work

1 Like
3

hi， thats exactly what I did(i used goto id attribute) but it still doesn’t work