如何使用输入字段作为目的地的查询参数? [英] How to use an input field as query parameter to a destination?

问题描述

对于我的示例Google Chrome扩展程序，我有一个文本框和一个链接:

For my sample Google Chrome extension, I have a textbox and a link:

<input id="textbox" type="text" value="" size="25" />
<a class="button" href="http://www.google.com"><span>Search</span></a>

当用户单击链接时，我希望浏览器实际转到:

When the user clicks on the link, I want the browser to actually go to:

http://www.google.com/search?q=<whatever was in textbox>

我该怎么做?

推荐答案

为此，我强烈建议您使用带有提交按钮的普通表单.在这种情况下，您甚至根本不需要使用JavaScript.例如:

I strongly advice you to use an ordinary form with a submit button for this. In that case, you even don't have to use JavaScript at all. For example:

<form action="http://www.google.com/search">
    <input id="textbox" name="q" type="text" value="" size="25" />
    <input type="submit" value="Search" />
</form>

如果您确实要使用提供的标记，则最好的办法是在a元素中添加一个ID，例如searchButton，然后执行:

If you really want to use the provided markup, best thing you can do is to add an ID to the a element, e.g. searchButton, and then do:

document.getElementById("searchButton").onclick = doSearch;

function doSearch() {
    var v = document.getElementById("textbox").value;
    window.location = "http://www.google.com/search?q=" + encodeURIComponent(v);
    return false; // not entirely necessary, but just in case
}

这篇关于如何使用输入字段作为目的地的查询参数?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！