javascript - 获取 HTML 输入并构建查询字符串

Question

我需要构建一个表单来获取用户输入并构建一个查询字符串，然后加载该 URL

例如

<form id="form1" name="form1" method="post" action="">
  <p>
    <label>INPUT1
      <input type="text" name="INPUT1" id="INPUT1" />
    </label>
  </p>
  <p>
    <label>INPUT2
      <input type="text" name="INPUT2" id="INPUT2" />
    </label>    
  </p>
  <p>
    <label>
      <input type="submit" name="loadURL" id="loadURL" value="Submit" />
    </label>
    <br />
  </p>
</form>

http://website.com&model=<INPUT1>&cathegory=<INPUT2>

有没有办法仅使用 HTML 来完成此操作，还是需要 javascript？任何有关执行此操作的最简单方法的指示都将受到赞赏。

Answer 1

只需设置 action="/some/form/processor"和 method="get" (而不是发布)并且表单中的字段将作为查询字符串发送。

获取 http://website.com&model=<INPUT1>&cathegory=<INPUT2> 的示例你会有

<form id="form1" name="form1" method="get" action="http://website.com">
<!-- or, more simply, since the website _is_ website.com -->
<form id="form1" name="form1" method="get" action="/">

input 名称 用作参数，因此您的完整表单将是

<form id="form1" name="form1" method="get" action="/">
  <p>
    <label>INPUT1
      <input type="text" name="model" id="INPUT1" />
    </label>
  </p>
  <p>
    <label>INPUT2
      <input type="text" name="cathegory" id="INPUT2" />
    </label>    
  </p>
  <p>
    <label>
      <input type="submit" name="loadURL" id="loadURL" value="Submit" />
    </label>
    <br />
  </p>
</form>