Как достичь желаемой страницы, когда пользователь выбирает «Открыть в новой вкладке» / «Открыть в новом окне», а не нажимает с помощью html / javascript

#javascript #html #onclick #url-parameters

#javascript #HTML #onclick #url-параметры

Вопрос:

Я беру параметры из URL-адреса и передаю их на другие страницы сайта, поэтому я использовал этот код для этого…

Для…

 https://example.com/page1/?Id=12345amp;Email=email@email.com

 

Я могу передать параметры «Id» и «Email» на следующую страницу с помощью приведенного ниже кода…

 <script>
const params = new URLSearchParams(document.location.search);
const infusionId = params.get("Id");
const infusionEmail = params.get("Email");
const page2 =()=>window.location.assign(`https://example.com/page2/?Id=${infusionId}amp;Email=${infusionEmail}`);
</script>
<a href="#" onclick="page2()">Click here to get to Page 2</a>
 

Это отлично работает, когда я нажимаю на ссылку, чтобы перейти на следующую страницу, но если я щелкну правой кнопкой мыши по ссылке и выберу «Открыть в новой вкладке» «Открыть в новом окне» «Открыть в инкогнито»… перезагружается та же страница…

Как я могу настроить это так, чтобы это работало при щелчке правой кнопкой мыши по ссылке и выборе для просмотра целевой страницы (страница 2 в этом примере) в новой вкладке или окне или инкогнито … или каким-либо другим способом браузеры могут разрешить отображение целевой страницы в браузере?

Комментарии:

1. Вы бы обновили ссылку href при загрузке страницы и позволили браузеру обрабатывать открытие вкладки вместо того, чтобы onclick

Ответ №1:

Вы можете задать путь к странице 2 в href и скопировать все параметры непосредственно в search свойство <a> элемента from location.search .

<a> Элемент имеет все те же свойства, location что и does.

Если вам нужно удалить некоторые параметры с текущей страницы перед переходом к <a> вы можете перебирать URLSearchParams() объект и удалять их из объекта и передавать сам объект в

  linkElement.search = mySearchParamsObject
 

также без необходимости разбора на строку

 // demo only add search params to url
history.pushState(null, null, '/?Id=12345amp;Email=email@email.com')

const link = document.querySelector('a')
link.search = location.search;

console.log('Updated href:n', link.href) 
 <a href="https://example.com/page2/" >Click here to get to Page 2</a>