Как обмениваться переменными между двумя HTML-страницами? - PullRequest
8 голосов
/ 16 сентября 2010

У меня есть две HTML-страницы, example1.html и example2.html.

Как передать переменные из example1.html в example2.html, используя строку запроса, и извлечь эту переменную в example2.html, не используя серверный код?

Ответы [ 3 ]

13 голосов
/ 16 сентября 2010

В example1.html:

<a href='example2.html?myVar1=42'>a link</a>
<a href='example2.html?myVar1=43'>another link</a>

или сгенерируйте ссылки с помощью Javascript по желанию.Просто убедитесь, что значение? VarName = value каким-то образом попадает в конец example2.html.

Затем, в example2.html, вы используете Javascript для анализа строки запроса, с которой поставляется example2.

Для этого вы можете попробовать Querystring.

// Adapted from examples on the Querystring homepage.
var qs = new Querystring();
var v1 = qs.get("myVar1");

В качестве альтернативы parent.document.URL содержит полный URI для страницы, на которой вы находитесь.Вы можете извлечь это:

parent.document.URL.substring(parent.document.URL.indexOf('?'), parent.document.URL.length);

и проанализировать его вручную, чтобы извлечь переменные, которые вы закодировали в URI.

РЕДАКТИРОВАТЬ: Забыли «новую» часть «новой Querystring ()».К сожалению ...

7 голосов
/ 21 апреля 2016

HTML / HTTP не имеет состояния, это означает, что то, что вы делали / видели на предыдущей странице, полностью отключено от текущей страницы. Вопрос в том, как передать переменную между двумя страницами в переднем конце. (Поскольку HTTP не имеет состояния, каждый раз, когда вы загружаете страницу, он будет использовать начальные значения того, что вы установили в JavaScript. Вы не можете установить глобальную переменную в JS и просто оставить это значение после загрузки страницы снова.

Существует несколько способов сохранить значение в другом месте, чтобы можно было инициализировать его при загрузке с помощью JavaScript)

1) - Простое использование хранилищ внешнего интерфейса, которое оснащает любой браузер (файлы cookie, хранилище сеансов, локальное хранилище - которые по соображениям безопасности доступны в одном домене -> это означает, что вы можете сохранять данные в этом хранилище только для одного домена, другого домен не может получить доступ к этим данным) и поместить значение на одной странице и получить значение на других. Учитывая, что:

Cookie сохраняет данные до определенного вами времени,

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

Локальное хранилище сохраняет данные до тех пор, пока Браузер полностью не закрывается и не обменивается данными между вкладками (страницами). Оно хранит данные без даты истечения срока их действия и очищается только с помощью JavaScript или очистки кэша браузера / Локально сохраненных данных - в отличие от срока действия файлов cookie.

2) - Добавить атрибуты к элементу, когда он генерируется с помощью функции рендеринга Ajax

<a href='example2.html?action=getAll&element=product&id=1'>a link</a>
<a href='example2.html?action=getAll&element=product&id=2'>another link</a>

-> и после щелчка по этому элементу построить «URL /? action = getAll & element = product & id = 1 “и на второй странице, которая пропадет action, вы можете проанализировать этот URL и вызвать соответствующий Ajax с соответствующими параметрами.

2 голосов
/ 16 сентября 2010

Вы можете использовать куки и Querystring для обмена значениями.

...