Открытие ссылки в новом окне

YaroslavWeb · June 19, 2018

Мне нужно чтобы ссылка открывалась в новом окне.
Вот код

<table class="mytable">
	<tbody>
	<tr class="mystolb" onclick="window.location.href='%%LitUrlAudio%%'; return false target="_blank">
		<td><img src="http://knigobiz.ru/wp-content/uploads/2018/05/LitRes.png" class="laravel-icon">ЛитРес</td>
		<td>Аудиокнига</td>
		<td>₽%%LitAudioPrice%%</td>
<td><i class="fas fa-shopping-cart"></i></td>
	</tr>
	</tbody>
</table>

То есть при нажатии на строку у меня происходит переход по произвольной ссылке, мне нужно сделать так чтобы она открывалась в новом окне

klierik · June 19, 2018

Правильно, так не будет работать.

Вот рабочий пример: https://jsfiddle.net/u0hdes6L/

klierik · June 19, 2018

Здравствуйте.

Воспользуйтесь window.open('%%LitUrlAudio%%')

YaroslavWeb · June 19, 2018

22 минуты назад, klierik сказал:

Здравствуйте.

Воспользуйтесь window.open('%%LitUrlAudio%%')

Написал следующим образом, ничего не работает

<tr class="mystolb" onclick="window.open('%%LitUrlAudio%%'); return false">

YaroslavWeb · June 19, 2018

12 минут назад, klierik сказал:

Правильно, так не будет работать.

Вот рабочий пример: https://jsfiddle.net/u0hdes6L/

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

Скрытый текст

и он всё равно не работает

Edited June 19, 2018 by klierik

klierik · June 19, 2018

На предоставленном Вами скриншоте неверная запись. Надо использовать:

onclick="window.open('%%LitUrlAudio%%')"

а не

onclick="window.open.href='%URL%'"

А так же не надо добавлять

return false;

Взгляните как реализованно в примере:

YaroslavWeb · June 19, 2018

Я понимаю, но видимо это уже проблема плагина для wordpress. На входе я пишу так же как и вы в примере, но на выходе код переделывается на тот который в скиншоте, не знаю с чем это связанно, но сейчас буду разбираться. Спасибо за помощь)

SelenIT · June 23, 2018

Я бы сделал примерно так:

<table class="mytable">
	<tbody>
	<tr class="mystolb" onclick="this.getElementsByClassName('js-action-link')[0].click()">
		<td><img src="http://knigobiz.ru/wp-content/uploads/2018/05/LitRes.png" class="laravel-icon">ЛитРес</td>
        <td>Аудиокнига <a class="js-action-link visually-hidden" href="%%LitUrlAudio%%" target="_blank">(слушать)</a></td>
		<td>₽%%LitAudioPrice%%</td>
<td><i class="fas fa-shopping-cart"></i></td>
	</tr>
	</tbody>
</table>

Для класса visually-hidden задать стили, делающие ссылку невидимой (лучше всего делать это скриптом же, по событию DOMContentLoaded или просто в конце <body>). Так даже юзеры с выключенным JS смогут открыть аудиокнигу в новом окне. А при включенном JS ссылка будет невидимой, но по клику на строку таблицы она сработает.

Sign In

Открытие ссылки в новом окне

Question

YaroslavWeb

Link to comment

Share on other sites

7 answers to this question

Recommended Posts

klierik

Link to comment

Share on other sites

klierik

Link to comment

Share on other sites

YaroslavWeb

Link to comment

Share on other sites

YaroslavWeb

Link to comment

Share on other sites

klierik

Link to comment

Share on other sites

YaroslavWeb

Link to comment

Share on other sites

SelenIT

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information