如何拼接搜索查询词与预设文本生成正确的Bing站点搜索URL

API 探路者

2026-9-25

解决方案

你现有代码的问题是给两个输入框都设置了name属性，GET 方式提交表单时，所有带name的输入框内容都会作为独立的查询参数拼接，所以才会出现&q1=的多余参数。可以通过 JavaScript 监听表单提交事件，在提交前合并查询条件，以下是可直接运行的修改方案：

最简实现（内联事件）

<form method="get" action="https://www.bing.com/search" onsubmit="mergeQuery(this)">
    <input type="text" name="q" size="25" maxlength="255" value="Hakunamatata" />
    <input type="hidden" name="q1" value="site:www.imdb.com/title" />
    <input type="submit" value="Bing Search" />
</form>
<script>
function mergeQuery(form) {
    // 拼接两个查询条件，中间加空格即可，浏览器会自动将空格编码为+号
    form.q.value = form.q1.value.trim() + ' ' + form.q.value.trim();
    // 禁用多余的输入框，提交时不会生成额外参数
    form.q1.disabled = true;
}
</script>

规范实现（事件监听，无内联JS）

<form id="bingSearchForm" method="get" action="https://www.bing.com/search">
    <input type="text" name="q" size="25" maxlength="255" value="Hakunamatata" />
    <!-- 去掉name属性，默认就不会被表单提交 -->
    <input type="hidden" id="siteRule" value="site:www.imdb.com/title" />
    <input type="submit" value="Bing Search" />
</form>
<script>
const searchForm = document.getElementById('bingSearchForm');
searchForm.addEventListener('submit', function() {
    const qInput = this.querySelector('input[name="q"]');
    const siteRule = document.getElementById('siteRule').value.trim();
    qInput.value = siteRule + ' ' + qInput.value.trim();
});
</script>