如何通过文本输入框的输入更改iframe的src

Question

我想在项目的浏览器中创建一个浏览器。我需要有一个div。 div内将是一个表单，其中包含一个文本输入框和一个提交按钮以及一个iframe。我想知道是否有一种方法可以在表单提交时更改iframe src以匹配输入。如果可能的话，我想使用jquery。

var value = $("#text").val();
$(document).ready(function(){
    $("#form").submit(function(){
        e.preventDefault();
        $("iframe").attr("src", $("#text").val());
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="indiv">
  <form id="form">
    <input type="text" id="text">
    <input type="submit">
  </form>
  <iframe src=""></iframe>
</div>

以上是我的尝试。

Answer 1

我以为可以将此添加为评论，但是我没有特权。使用onclick函数代替表单“ action”。

<div>
  <form>
  <input type="text" id="url" value="https://">
  <input type="submit" onclick="document.getElementById('browser').src=document.getElementById('url').value">
  </form>
  <iframe src="" id="browser"></iframe>
</div>