在 iframe 中打开搜索答案

【问题标题】：Open a search in a iframe在 iframe 中打开搜索
【发布时间】：2022-10-16 21:56:53
【问题描述】：

在我说什么之前，是的，我知道 iframe 已经过时了。所以我正在尝试用html制作一个浏览器，一个浏览器中的浏览器。我有一个搜索栏，它会在新窗口中打开你输入的内容，它会搜索你在谷歌上输入的内容，我想让你输入的内容在 iframe 中打开谷歌搜索，你知道我该怎么做吗？

搜索栏的 HTML：

<form role="search" id="form">
                        <input type="search" id="query" name="q"
                       placeholder="Search..."
                       aria-label="Search through site content">
                        <button>
              <svg viewBox="0 0 1024 1024"><path class="path1" d="M848.471 928l-263.059-263.059c-48.941 36.706-110.118 55.059-177.412 55.059-171.294 0-312-140.706-312-312s140.706-312 312-312c171.294 0 312 140.706 312 312 0 67.294-24.471 128.471-55.059 177.412l263.059 263.059-79.529 79.529zM189.623 408.078c0 121.364 97.091 218.455 218.455 218.455s218.455-97.091 218.455-218.455c0-121.364-103.159-218.455-218.455-218.455-121.364 0-218.455 97.091-218.455 218.455z"></path></svg>

  <br>
  <iframe class="window" width="1000" height="600"></iframe>

搜索栏的 JS：

const f = document.getElementById('form');
const q = document.getElementById('query');
const google = 'https://www.google.com/search?q=+';

function submitted(event) {
  event.preventDefault();
  const url = google + '+' + q.value;
  const win = window.open(url, '_blank');
  win.focus();
}

f.addEventListener('submit', submitted);

【问题讨论】：

标签： javascript html google-chrome search browser

【解决方案1】：

可以使用以下链接在 iframe 中打开 google：https://google.com/webhp?igu=1。如果您想在上面的代码中实现这一点，代码如下

<form role="search" id="form">
  <input type="search" id="query" name="q"
  placeholder="Search..."
  aria-label="Search through site content">
  <button>
  <svg viewBox="0 0 1024 1024"><path class="path1" d="M848.471 928l-263.059-263.059c-48.941 36.706-110.118 55.059-177.412 55.059-171.294 0-312-140.706-312-312s140.706-312 312-312c171.294 0 312 140.706 312 312 0 67.294-24.471 128.471-55.059 177.412l263.059 263.059-79.529 79.529zM189.623 408.078c0 121.364 97.091 218.455 218.455 218.455s218.455-97.091 218.455-218.455c0-121.364-103.159-218.455-218.455-218.455-121.364 0-218.455 97.091-218.455 218.455z"></path></svg>
  <br>
  <iframe class="window" width="1000" height="600"></iframe>

和 javascript 将是

const f = document.getElementById('form');
const q = document.getElementById('query');
const google = 'https://www.google.com/search?igu=1&q=';

function submitted(event) {
  event.preventDefault();
  const url = google + q.value;
  const win = window.open(url, '_blank');
  win.focus();
}

f.addEventListener('submit', submitted);

【讨论】：