target="_blank" 不打开新窗口

Question

target="_blank" 不打开新窗口，只在同一个窗口中导航到新页面，如下图：

<form onSubmit="return process();" target="_blank"> 
<input type="text" name="url" id="url"  placeholder="Product ID"> <input type="submit" value="Search">
</form> 
<script>
function process(){
    var url= "https://myurl.com/products/" + document.getElementById("url").value.trim();
    location.href=url; return false;
}
</script> 

Answer 1

当您单击该按钮时，代码会立即触发，因此您的代码将导航到另一个页面，但位于同一选项卡中。

target="_blank" 仅在表单具有将数据发送到的操作时才有效。

请改用window.open(url)。

function process() {
  var url = "https://myurl.com/products/" + document.getElementById("url").value.trim();
  window.open(url);
  return false;
}

<form onSubmit="return process();" target="_blank">
  <input type="text" name="url" id="url" placeholder="Product ID"> <input type="submit" value="Search">
</form>

---

或者在你的流程函数中将url分配给表单的action属性，并删除return false

我将表单命名为f

function process() {
  var url = "https://myurl.com/products/" + document.getElementById("url").value.trim();
  document.f.setAttribute('action', url);

}

<form onSubmit="return process();" name="f" target="_blank">
  <input type="text" name="url" id="url" placeholder="Product ID"> <input type="submit" value="Search">
</form>