HTML Get方法

Question

我创建了一个包含一个文本字段和一个选择字段并使用GET方法的表单。提交表单时是否可以将参数合并为一个？示例：test.html？domain = test.com

<form action = "test.html" method = "GET">
     Name: <input type = "text" name = "domain" />
      <select name="domain_ext" class="inputAuto">
        <option value=".com">.com</option>
      </select>
     <input type = "submit" />
  </form>

Answer 1

您可以使用XHR https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest

这是一个非常基本的例子：

var getData = function () {
  var xhr = new XMLHttpRequest();
  var domain = document.querySelector('.domainInput').value;
  var ext = document.querySelector('.extInput').value;
  xhr.responseType = 'text';
  xhr.onload = function () {
    if (xhr.readyState === xhr.DONE && xhr.status === 200) {
      document.querySelector('.output').innerText = xhr.responseText;
    }
  };
  xhr.open('GET', domain + ext, true);
  xhr.send(null);
};

document.querySelector('.getButton').addEventListener('click', getData);

<form>
   Name: <input type="text" value="https://output.jsbin.com/juwuy" class="domainInput" />
    <select class="extInput">
      <option value=".js" default>.js</option>
      <option value=".com">.com</option>
    </select>
   <input type="button" value="Get" class="getButton"/>
</form>
<p class="output"></p>