Как сделать ссылку открывать несколько страниц при нажатии - PullRequest
37 голосов
/ 15 августа 2011

У меня есть две (или более) ссылки.Например: http://google.com и http://yahoo.com.

Как сделать так, чтобы они оба открывались при нажатии на одну ссылку?

Например,ссылка под названием «кликни здесь», при нажатии на которую открывается два разных пустых окна.

Ответы [ 7 ]

40 голосов
/ 15 августа 2011

HTML:

<a href="#" class="yourlink">Click Here</a>

JS:

$('a.yourlink').click(function(e) {
    e.preventDefault();
    window.open('http://yoururl1.com');
    window.open('http://yoururl2.com');
});

window.open также может принимать дополнительные параметры.Смотрите их здесь: http://www.javascript -coder.com / window-popup / javascript-window-open.phtml

Вы также должны знать, что window.open иногда блокируется блокировщиками всплывающих окон и/ или рекламные фильтры.

Дополнение от Пола ниже: Этот подход также устанавливает зависимость от включаемого JavaScript.Обычно это не очень хорошая идея, но иногда необходимо.

15 голосов
/ 31 мая 2013

Я сделал это простым способом:

    <a href="http://virtual-doctor.net" onclick="window.open('http://runningrss.com');
return true;">multiopen</a>

Он откроет runningrss в новом окне и virtual-doctor в том же окне.

9 голосов
/ 15 августа 2011

Возможно, вы захотите расположить свой HTML так, чтобы пользователь мог по-прежнему открывать все ссылки, даже если JavaScript не включен.(Мы называем это прогрессивным улучшением.) Если это так, что-то вроде этого может работать хорошо:

HTML

<ul class="yourlinks">
    <li><a href="http://www.google.com/"></li>
    <li><a href="http://www.yahoo.com/"></li>
</ul>

jQuery

$(function() { // On DOM content ready...
    var urls = [];

    $('.yourlinks a').each(function() {
        urls.push(this.href); // Store the URLs from the links...
    });

    var multilink = $('<a href="#">Click here</a>'); // Create a new link...
    multilink.click(function() {
        for (var i in urls) {
            window.open(urls[i]); // ...that opens each stored link in its own window when clicked...
        }
    });

    $('.yourlinks').replaceWith(multilink); // ...and replace the original HTML links with the new link.
});

В этом коде предполагается, что вына одну страницу нужно использовать только один «многоканальный».(Я также не проверял это, так что, вероятно, он пронизан ошибками.)

3 голосов
/ 06 сентября 2013

Вы можете открыть несколько окон одним щелчком мыши ... Попробуйте это ..

<a href="http://--" 
     onclick=" window.open('http://--','','width=700,height=700'); 
               window.open('http://--','','width=700,height=500'); ..// add more"
               >Click Here</a>`
0 голосов
/ 12 марта 2019

Если вы предпочитаете сообщать посетителю, какие ссылки будут открыты, вы можете использовать функцию JS для чтения ссылок из HTML-элемента. Вы даже можете позволить посетителю написать / изменить ссылки, как показано ниже:

<script type="text/javascript"> 
    function open_all_links() {
        var x = document.getElementById('my_urls').value.split('\n');
        for (var i = 0; i < x.length; i++)
            if (x[i].indexOf('.') > 0)
            if (x[i].indexOf('://') < 0)
                window.open('http://' + x[i]);
            else
                window.open(x[i]);
    }
</script>



<form method="post" name="input" action=""> 
    <textarea id="my_urls" rows="4" placeholder="enter links in each row..."></textarea>
    <input value="open all now" type="button" onclick="open_all_links();">
</form>
0 голосов
/ 09 мая 2017

Я создал немного гибридный подход между подходом Пола и Адама:

Ссылка, открывающая массив ссылок, уже есть в html. Jquery просто создает массив ссылок и открывает каждую, когда нажата кнопка «open-all»:

HTML:

<ul class="links">
<li><a href="http://www.google.com/"></a></li>
<li><a href="http://www.yahoo.com/"></a></li>
</ul>

<a id="open-all" href="#">OPEN ALL</a>

Jquery:

$(function() { // On DOM content ready...
    var hrefs = [];

    $('.links a').each(function() {
        hrefs.push(this.href); // Store the URLs from the links...
    });

    $('#open-all').click(function() {
        for (var i in hrefs) {
            window.open(hrefs[i]); // ...that opens each stored link in its own window when clicked...
        }
    });
});

Вы можете проверить это здесь: https://jsfiddle.net/daveaseeman/vonob51n/1/

0 голосов
/ 28 октября 2016

Вам нужно разблокировать всплывающие окна для вашего браузера, и код может работать.

хром: // настройки / contentExceptions # всплывающие окна

Chrome browser setting

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...