JavaScript 获取 URL 值并发布到 iFrames

Question

我正在尝试复制此站点的脚本功能：http://responsinator.com/

这个想法是从表单中获取 URL 并插入到一个或多个 iFrame 中。

对不起，我有点菜鸟。我认为这很简单，但被卡住了。这是我目前所处的位置：

http://jsfiddle.net/xtpD5/

  function handleButtonEnterClick() {
    var textbox_value = document.getElementById("url_textbox").value;
    document.getElementById('myUrl').value = window.location;
    var form = document.getElementById('myForm');
    form.action = textbox_value;
    form.submit();
}

<div id="container">
<form action="" method="post" id="myForm">
    <p>Enter URL:</p>
    <input type="hidden" id="myUrl" name="url" />
    <input type="text" id="url_textbox" name="url_textbox" />
    <input type="button" id="button_enter" name="button_enter" 
           value="enter" onclick="handleButtonEnter" />
</form>
</div>

谢谢！

Answer 1

像这样？ http://jsfiddle.net/xtpD5/1/

您可以通过 target 属性将表单提交到 iframe。它会在 iframe 中打开它

function handleClick() {
    var url = document.getElementById('url_textbox').value;
    document.getElementById('myForm').action = url;
    return true;
}

<div id="container">
    <form action="" method="post" id="myForm" target='iframe'>
        <p>Enter URL:</p>
        <input type="hidden" id="myUrl" name="url" />
        <input type="text" id="url_textbox" name="url_textbox" />
        <input id="button_enter" name="button_enter" value="enter" type="submit" />
    </form>
</div>
<iframe name="iframe"></iframe>