在表单字段中输入文本，在提交时生成多个 URL 并在新选项卡中打开链接

Posted 2023-02-22

【中文标题】在表单字段中输入文本，在提交时生成多个 URL 并在新选项卡中打开链接

【英文标题】：Input text in form-field, generate multiple URLs on submit and open the links in new tabs

【发布时间】：2019-05-21 19:28:53

【问题描述】：

我希望输入文本，然后用于生成多个 URL 并在不同的选项卡中打开每个 URL。

http://jsfiddle.net/Gv5bq/1/

    <input type="text" id="text" />
<input type="button" id="btn" value="Submit" onClick="javascript: window.open('http://www.mywebsite.com/print/' + document.getElementById('text').value);" />
<input type="button" id="btn" value="Submit" onClick="javascript: window.open('http://www.anywebsite.com/print/' + document.getElementById('text').value);" />

基本上可以满足我的需要，但只针对一个而不是多个 URL。

例如： 输入：hello123 在提交时为以下每个 URL 打开一个选项卡 例如 www.mywebsite.com/print/hello123/ 和 www.anywebsite.net/q=hello123&sort

【参考方案1】：

您可以在下面找到一个代码示例

HTML

<input type="text" id="text" />
<input type="button" id="btn" value="Submit" onclick="openURLs(document.getElementById('text').value)"/>

JavaScript

function openURLs(url)
  var baseURLs = [`www.mywebsite.com/print/$url/`, `www.anywebsite.net/q=$url&sort`]

  baseURLs.forEach(function(u) 
    window.open(u);
  );

【讨论】：

谢谢你，但它不起作用。当我点击“提交”时没有任何反应。

嗨@Chris，脚本是正确的，但目标域必须允许打开不同域的窗口。 meta.***.com/questions/337916/…

【参考方案2】：

function openURL()
     var txt = document.getElementById('text').value;
     var link1 = 'http://www.mywebsite.com/print/'+ txt;
     var link2 = 'http://www.anywebsite.com/q='+ txt + '&sort';
     var i;
    for(i = 1; i < 3; i++)
      if(i == 1)
      
    	   window.open(link1, '_blank');  
      
      else if (i==2)
      
      //it will be execute after 5 seconds
        setTimeout(function()
         window.open(link2, '_blank');  
         , 5000);
       
    
    	
      
    

<input type="text" id="text" />
<input value="Submit" type="button" onclick="openURL()">

我更新了小提琴check here。它会给你你想要的结果。例如：如果您在下面输入hello123，则会打开受尊重的网址

http://www.mywebsite.com/print/hello123 http://www.anywebsite.com/q=hello123&sort

【讨论】：

感谢分享，但是当我点击“提交”时，什么也没有发生。

@Chris 我更新了答案检查它现在可以工作或检查这个小提琴jsfiddle.net/Udhaytitus/egyqd5cn

谢谢。不幸的是，只有一个打开了 2 个 URL 中的第一个。

检查上面的 jsfiddle 两个 url 都工作正常，但你应该允许网站弹出。

谢谢@Udhay Titus 这正是我想要的！

【参考方案3】：

请检查始终允许弹出窗口，然后使用此代码

<input type="text" id="text" />
<input type="button" id="btn" value="Submit" onClick="javascriptFun()" />
<script>
function javascriptFun()
window.open('http://www.mywebsite.com/print/' + document.getElementById('text').value,'_blank');
window.open('http://www.mywebsite1.com/print/' + document.getElementById('text').value,'_blank');
window.open('http://www.mywebsite2.com/print/' + document.getElementById('text').value,'_blank');



</script>

【讨论】：

谢谢。如果在变量文本输入之后有一些更固定的值，代码会是什么样子，请参见我原来的问题中的示例：www.anywebsite.net/q=hello123&sort