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

时间:2011-12-06 21:38:22

标签: javascript html

我需要构建一个表单来获取用户输入并构建一个查询字符串,然后加载该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?有关最简单方法的任何指示都表示赞赏。

1 个答案:

答案 0 :(得分:9)

只需设置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>