2017-05-24 158 views
1

我有一个请求:Javascript按钮打开新标签页中的链接

我有一个应用程序,它可以将书籍链接到亚马逊书上的链接。我一次会粘贴50-100个isbns,我必须点击每个链接才能查看关于Amazon及其繁重的书籍。

有人可以帮助我实现一个按钮,它打开窗口中新选项卡中的所有isbn链接?如果我能有一个人帮助我获得了一个按钮,只用1次点击它会拯救我的手做这个=)

这里是的jsfiddle代码:https://jsfiddle.net/ks51zch8/

<html> 
<head> 

</head> 
<div><b>ISBN Hyperlinker</b></div> 
<textarea id=numbers placeholder="paste isbn numbers as csv here" style="width:100%" rows="8" > 

</textarea> 
<div><b>Hyperlinked text:</b></div> 
<div id="output" style="white-space: pre"></div> 


<script> 


//the input box. 
var input = document.getElementById('numbers'); 
var output = document.getElementById('output') 
var base = 
    'https://www.amazon.com/s/ref=nb_sb_noss?url=search-alias%3Daps&field-keywords=' 



//adding an event listener for change on the input box 
input.addEventListener('input', handler, false); 

//function that runs when the change event is emitted 
function handler() { 
    var items = input.value.split(/\b((?:[a-z0-9A-Z]\s*?){10,13})\b/gm); 
    // Build DOM for output 
    var container = document.createElement('span'); 
    items.map(function (item, index) { 
    if (index % 2) { // it is the part that matches the split regex: 
     var link = document.createElement('a'); 
     link.textContent = item.trim(); 
     link.setAttribute('target', '_blank'); 
     link.setAttribute('href', base + item); 
     container.appendChild(link); 
    } else { // it is the text next to the matches 
     container.appendChild(document.createTextNode(item)) 
    } 
    }); 
    // Replace output 
    output.innerHTML = ''; 
    output.appendChild(container); 
} 
handler(); // run on load 


</script> 
</html> 

回答

1

如果您有URL作为一个字符串在JavaScript中,将其传递到window.open,它将在新标签中打开。您可以循环播放,并根据需要多次播放。

下面是您的代码,进行一些小修改:存储url的数组以及点击时会将它们全部打开到新窗口中的按钮。 (注意:SNIPPIT不会工作,因为它不允许弹出窗口)

var input = document.getElementById('numbers'); 
 
var button = document.getElementById('button'); 
 
var output = document.getElementById('output') 
 
var base = 
 
    'https://www.amazon.com/s/ref=nb_sb_noss?url=search-alias%3Daps&field-keywords=' 
 

 
var urls = [] 
 
\t 
 
//adding an event listener for change on the input box 
 
input.addEventListener('input', handler, false); 
 
button.addEventListener('click', openAllUrls, false); 
 

 
//function that runs when the change event is emitted 
 
function handler() { 
 
    var items = input.value.split(/\b((?:[a-z0-9A-Z]\s*?){10,13})\b/gm); 
 
    urls=[]; 
 
    // Build DOM for output 
 
    var container = document.createElement('span'); 
 
    items.map(function (item, index) { 
 
    if (index % 2) { // it is the part that matches the split regex: 
 
     var link = document.createElement('a'); 
 
     link.textContent = item.trim(); 
 
     link.setAttribute('target', '_blank'); 
 
     link.setAttribute('href', base + item); 
 
     container.appendChild(link); 
 
     urls.push(base + item);//add the url to our array of urls for button click 
 
    } else { // it is the text next to the matches 
 
     container.appendChild(document.createTextNode(item)) 
 
    } 
 
    }); 
 
    // Replace output 
 
    output.innerHTML = ''; 
 
    output.appendChild(container); 
 
} 
 
function openAllUrls(){ 
 
    for(var i=0; i< urls.length; i++){//loop through urls and open in new windows 
 
    window.open(urls[i]); 
 
    } 
 
} 
 
handler(); // run on load
<div><b>ISBN Hyperlinker</b></div> <textarea id=numbers placeholder="paste isbn numbers as csv here" style="width:100%" rows="8" > 
 
</textarea> <div><b>Hyperlinked text:</b></div> <div id="output" style="white-space: pre"></div> 
 
<input type="button" id="button" Value="Open All"/>

+0

上帝,我爱你!你是最棒的! :) –

相关问题