有什么办法可以在一个表单中使用多个输入？答案

【问题标题】：Is there any way I can use multiple inputs in a form?有什么办法可以在一个表单中使用多个输入？
【发布时间】：2020-07-26 17:25:45
【问题描述】：

我在做我的项目时遇到了麻烦。在我的项目中，我在 HTML 中进行谷歌高级搜索，我需要 4 个字段。这 4 个字段是用户输入，其中指定了他们在搜索中想要的边界。当用户点击 google 搜索时，它会在 javascript 中执行 result() 操作。结果从文本框中获取这些输入并将其存储为变量并调用警报。我的问题是如何获取我在 javascript 中形成的字符串并将其用作 google 搜索的表单响应。

function result() {
    var atw = document.getElementById("aTW").value;
    var ewp = document.getElementById("eWP").value;
    var tw = document.getElementById("tW").value;
    var ntw = document.getElementById("nTW").value;
    var string = atw + " " + tw + " " + "\"" + ewp + "\"" + " " + "-" + ntw;
    alert(string);

}

<h3>Advanced Search</h3>
<form action="https://www.google.com/search">
   <p>     
      <label>All these words</label>
      <input type = "text"
         id = "aTW"
         value = ""/>
   </p>
   <p>
      <label>this exact word or phrase:</label>
      <input type = "text"
         id = "eWP"
         value = "" />
   </p>
   <p>
      <label>any of these words:</label>
      <input type = "text"
         id = "tW"
         value = "" />
   </p>
   <p>
      <label>none of these words:</label>
      <input type = "text"
         id = "nTW"
         value = "" />
   </p>
   <input type="text" name ="q" id = "inputs" placeholder="Search">     
   <input onclick = "result()" type="submit" value="Google Search">
</form>

【问题讨论】：

这是您要查找的信息吗？ developers.google.com/custom-search/docs/tutorial/…
@Rymo 这很有帮助，但我尝试使用 4 个文本框进行谷歌搜索，并组合成一个字符串，一旦它组合成一个字符串，我希望页面通过查询重定向到谷歌
nvm，我在javascript中使用了window.location.href命令并在javascript中重定向了页面。现在可以了！
很高兴你修好了！ ))

标签： javascript html css

【解决方案1】：

对字符串使用 split 方法

function result(){
event.preventDefault();
                var atw = document.getElementById("aTW").value;
                var ewp = document.getElementById("eWP").value;
                var tw = document.getElementById("tW").value;
                var ntw = document.getElementById("nTW").value;
                var string = atw +" "+ tw +" "+ "\""+ewp+"\""+" "+ "-"+ntw;
                alert(string);
                
                var myArray= string.split(" ");
                console.log(myArray);

            }

<h3>Advanced Search</h3>
            <form action="https://www.google.com/search"> 
                <p>     
                    <label>All these words</label>
                    <input type = "text"
                           id = "aTW"
                           value = ""/>
                  </p>
                  <p>
                    <label>this exact word or phrase:</label>
                    <input type = "text"
                           id = "eWP"
                           value = "" />
                  </p>
                  <p>
                    <label>any of these words:</label>
                    <input type = "text"
                           id = "tW"
                           value = "" />
                  </p>
                  <p>
                    <label>none of these words:</label>
                    <input type = "text"
                           id = "nTW"
                           value = "" />
                  </p>
                <input type="text" name ="q" id = "inputs" placeholder="Search">     
                <input onclick = "result()" type="submit" value="Google Search">
            </form>

【讨论】：

【解决方案2】：

how can I take the string I formed in javascript and use it as the form response for the google search.

将您的谷歌搜索查询作为您的字符串，然后将查询发送到谷歌搜索页面...

function  googleSearch(query){
  url = 'http://www.google.com/search?q=' + query;
  window.open(url, '_blank');
}

在你的 result() 函数中调用你的函数以进行谷歌搜索...

function result() {
  var atw = document.getElementById("aTW").value;
  var ewp = document.getElementById("eWP").value;
  var tw = document.getElementById("tW").value;
  var ntw = document.getElementById("nTW").value;
  var string = atw + " " + tw + " " + "\"" + ewp + "\"" + " " + "-" + ntw;
  alert(string);
  googleSearch(string);
}

https://jsfiddle.net/ov04hr12/

【讨论】：

【解决方案3】：

试试这个：

function result() {
  // all these words
  var atw = document.getElementById("aTW").value;
  // this exact phrase
  var ewp = document.getElementById("eWP").value;
  // any of these words
  var tw = document.getElementById("tW").value;
  // none of these words
  var ntw = document.getElementById("nTW").value;
  var string="https://www.google.com/search?";
  string+="as_q="+atw.split(" ").join("+");
  string+="&";
  string+="as_epq="+ewp.split(" ").join("+");
  string+="&";
  string+="as_oq="+tw.split(" ").join("+");
  string+="&";
  string+="as_eq="+ntw.split(" ").join("+");
  alert(string);
  window.open(string, '_blank');
}

从我在 google 上尝试过的高级搜索中获得了密钥 - 还有一些我没有包括在内的密钥，string 将是要在地址栏中发布的 URL，或者如上所述使用 window.open。

【讨论】：