Question

我正在使用wordpress，我想在用户点击图片后在同一浏览器窗口中打开多个标签我不知道如何使用wordpress实现它，所以我使用stackoverflow的javascript / jquery教程，我希望脚本可以在所有浏览器上工作，如chrome，firefox，等等。

我在html wordpress上编写此代码 - 用户点击小图片下载更大的图像文件：

<a href="http://www.example.com/cutecat1500x1250.png"><img src="http://example.com/wp-content/uploads/2014/12/cutecat125x125.png" border=0></a>

在用户点击小图片并开始下载过程的同时，浏览器将在新标签中打开多个网址：例如：http：//www.example.com/cute-dog-collection和http://www.example.com/cute-owl-collection

从这个来源：
Open a URL in a new tab (and not a new window) using JavaScript
open multiple tabs on a single window by a single click using JavaScript

这就是我所做的：
1.创建文件夹js，创建新文件：newtab.js然后添加此代码 - 我希望脚本只在特定页面上运行并发布，而不是所有页面和帖子。也没有阻止：

var win = window.open('url-link', '_blank');
if(win){
    win.focus();
}else{
    alert('Please allow popups for this site');
}

// hijack first anchor that has target=_blank, change href, next document click triggers it
var a = $('a[target="_blank"]')[0];
a.setAttribute('href', 'url-link');
$(document).click(function(){
    $('a[target="_blank"]')[0].click();
});

// create an anchor, add to body, next document click triggers it
var a = document.createElement('a');
a.setAttribute('href', 'url-link');
a.setAttribute('target', '_blank');
document.body.appendChild(a);
$(document).click(function(){
    a.click();
});

var linkArray = []; // your links
for (var i = 0; i < linkArray.length; i++) {
    // will open each link in the current window
    chrome.tabs.create({
        url: linkArray[i]
    });
}

然后我在function.php上添加了这段代码：

function new_tab_script（）{ wp_enqueue_script（ '我的-NEWTAB脚本'， get_template_directory_uri（）。 '/js/newtab.js'，阵列（ '的jquery'））; } add_action（'wp_enqueue_scripts'，'new_tab_script'）;
我测试了，但点击小图片后，什么也没发生。我想我在剧本中一定是错的。

请帮助，谢谢

Answer 1

我想我有解决你问题的方法。这是我测试过的代码。

<script type="text/javascript" src='JS/jquery-1.9.0.min.js'></script>
<script type="text/javascript">
  jQuery(function () {
    $('#firstLink').off('click');
    $('#firstLink').on('click', function (e) {
      e.preventDefault();
      window.open('PageTwo.html', '_blank');
      window.open('PageThree.html', '_blank');
    });
  });
</script>
</head>
<body>
   <a id="firstLink" href="#">Click me!</a>
</body>

此代码的工作方式与您想要的非常相似。但是，您可能遇到有关浏览器阻止弹出窗口的问题（严格说来这是一个弹出窗口，与宣传工作方式几乎相同）。你不能不做任何事情。用户必须手动允许您打开选项卡。

我希望它能解决你的问题。

单击图像后，在同一浏览器窗口中打开多个选项卡

1 个答案: