您如何获取用户的输入并将其添加到 iframe 中的 URL？
Posted
技术标签:
【中文标题】您如何获取用户的输入并将其添加到 iframe 中的 URL？【英文标题】：How do you take the user's input and add it to a URL in an iframe? 【发布时间】：2020-07-09 08:04:26 【问题描述】：我正在尝试制作一个具有多个搜索引擎并比较结果的网站
到现在为止
<!DOCTYPE html>
<html lang="en">
<head>
<title>fact checker</title>
</head>
<body>
<form method="get" action="https://www.dogpile.com/search">
<input type="text" name="q" size="31" value="">
</form>
<iframe id="Dogpile"
title="Dogpile"
src="https://www.dogpile.com">
</iframe>
</html>
我想输入表单并在 iframe 中打开搜索，而不是在另一个页面中打开它（使用 action="https://www.dogpile.com/search"）
您可以使用 javascript 将输入保存为变量吗？这行得通吗？
input = "https://www.dogpile.com/serp?q=" + input;
我不打算把它放到网上，我只是为了编码练习而做的
谢谢
【问题讨论】：
【参考方案1】：您可以使用 document.querySelector 进行输入
> let input = document.querySelector('input[name="q"]')
https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector
如果您想将其添加到表单操作中，您可以使用
$('form').on('submit',(el)=>
//Here we select currentTarget value(input value)
let input = document.querySelector('input[name="q"]')
//Here we change action form, .attr() with 1 param you get value of attr, if you
//put a second param you set the value of that attribute
$('form').attr('action',$('form').attr('action')+input)
)
$('form').on() 上的代码是获取它的值并添加输入值
https://api.jquery.com/attr/
【讨论】：
以上是关于您如何获取用户的输入并将其添加到 iframe 中的 URL？的主要内容，如果未能解决你的问题，请参考以下文章
如何从下拉框中获取用户选择的值并将其添加到模型中？ [重复]
您如何获取 git diff 文件，并将其应用到作为同一存储库副本的本地分支？
如何从 ngrx 存储中获取数据并将其更新到 Observable 变量中？