【问题标题】:How to navigate iframe using form (HTML)如何使用表单 (HTML) 导航 iframe
【发布时间】:2013-02-14 01:34:01
【问题描述】:

好的,我在名为“iframe”的网站上嵌入了一个 iFrame 还有一个叫做“form”的单行文本表单 还有一个名为“导航”的提交按钮

当我按“导航”时,我希望“iframe”导航到在“表单”中输入的网址

还有: 是否可以将 iframe 的网址添加到网页网址的末尾例如下面 http://www.example.com.htm/http://www.stackoverflow.com/

【问题讨论】:

    标签: html forms iframe navigation submit


    【解决方案1】:

    您可以通过让“导航”按钮调用 onClick javascript 函数或在提交时执行操作来设置 iframe URL,即

    <form action="JavaScript:navigate()">...</form>
    

    至于函数本身,您可以为 iframe 设置一个 ID,javascript 可以使用它来更改 URL 位置。

    <script> function navigate(){ window.frames['Iframe'].document.location.href = document.getElementByID('newLink').value; } </script>
    

    对于 iframe 来说:

    <iframe id="Iframe" src=""></iframe> 
    

    所以你的最终代码应该是这样的。

        <html>
        <head>
        <title>iFrame</title>
        <script>
        function navigate(){
    window.frames['Iframe'].document.location.href =  document.getElementByID('newLink').value;
    }    
    </script>
        </head>
        <body>
        <form action="JavaScript:navigate()">URL: <input type="text" id="newLink">
    

         <iframe id="Iframe" src=""></iframe> 
    
    
        </body>
        </html>
    

    【讨论】:

    • 对不起,你能告诉我每个元素(按钮、表单、框架)单独的脚本是什么吗? THX
    • 我已经尝试使用代码,但是 iframe 没有导航到表单中的 url。 :O thx
    猜你喜欢
    • 1970-01-01
    • 2018-10-02
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-08-04
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多