是否可以让一个表单输入文本有两个动作输出？

Question

我想做的是能够在表单输入文本字段中键入内容，然后按其中一个按钮来搜索我选择的结果：Google、Bing、DuckDuckGo或我想添加的任何其他内容。

我有这个：

<form method="get" action="https://www.google.com/search?=">
<input type="reset" />
<input type="text" name="q" autocomplete="off" autofocus />
<input type="submit" value="Google Search"/>
<input type="submit" value="Bing Search"/>
</form>

我确实在这里看到了 post，但不幸的是，代码并不完整： Is it possible to have two actions on a form?

post 表明

<form id="search" action="" method="get" onsubmit="javascript: return SubmitForm();">
<.... ret of the form>
</form>

和 js

function SubmitForm()
{
    showResultDiv();
    document.forms['search'].action='http://www.google.com/search';
    document.forms['search'].target='frame_result1';
    document.forms['search'].submit();

    document.forms['search'].action='http://www.bing.com/search';
    document.forms['search'].target='frame_result2';
    document.forms['search'].submit();
    return false;
}

从表面上看，这是可能的，但不确定如何实现。没有 PHP 的任何想法。只是 HTML 和 JS？谢谢你的时间。

Answer 1

您只能使用 HTML 来完成。

HTML

<form method="get"  target="blank" >
    <input type="reset" />
    <input type="text" name="q" autocomplete="off" autofocus />
    <input type="submit" value="Google Search" formaction="https://www.google.com/search"/>
    <input type="submit" value="Bing Search"  formaction="https://www.bing.com/search"/>
</form>

我找到了这个here

Answer 2

也许这不是最好的解决方案，但它有效并且比 get 方法更安全。如果在 win 之前调用 win2 它将专注于 google window.

<form id="form" role="search">
<input type="search" id="query" name="q" placeholder="Search..." aria-label="Search through site content">
<button>Search</button>

const f = document.getElementById('form');
const q = document.getElementById('query');
const google = 'https://www.google.com/search?q=+';
const bing = 'https://www.bing.com/search?q=+'
const site = '';
function submitted(event) {
event.preventDefault();
const urlG = google + site + '+' + q.value;
const urlB = bing + site + '+' + q.value;
const win = window.open(urlG, '_blank');
const win2 = window.open(urlB, '_blank');
win.focus();
win2.focus();
}
f.addEventListener('submit', submitted);

Answer 3

这个有效：

HTML:

<form method="get"  target="blank" >
    <input type="reset" />
    <input id="the-text" type="text" name="q" autocomplete="off" autofocus />
    <button id="submit">Search</button>
</form>

JavaScript:

let search = document.getElementById('submit')
search.addEventListener("click", searchFunction);

function searchFunction() {
let searchText = document.getElementById('the-text').value;
window.open('https://www.google.com/search?q='+searchText)
window.open('https://www.bing.com/search?q='+searchText)
}

不幸的是，浏览器通常会阻止同时打开 2 个或更多选项卡。所以，你可以允许弹窗，它会在 Google 和 Bing 上搜索，如果弹窗被阻止，它只会显示 google 的搜索结果和 Block Bing

是否可以让一个表单输入文本有两个动作输出？

Is it possible to have a form input text have two action outputs?

javascript

html

form-submit