Обмен переменной между несколькими страницами html

Question

У меня есть проект класса для создания html-страниц с javascript без использования каких-либо сообщений на стороне сервера, первый - это ввод пользователем специальных номеров. На первой странице инструктор должен ввести информацию о своем классе и номер своего ученика, , а затем, когда это будет сделано, он нажимает кнопку «Далее» и открывается новая страница с запросом на каждую информацию и оценки учеников. Но при переходе от первой страницы ко второй переменная номер ученика становится неопределенной. Я использую эту часть

var snum; 

function savesnum(val){ 
snum =val;} 

А также пытался,

var snum; 
function savesnum(){ 
snum = document.getElementById('stunb').value; } 

Answer 1

когда окно открыть новую страницу или перенаправлять на новую страницу, вы находитесь на новом объекте окна, не являются способный получить «snum», который определяется в первом объекте окна как глобальная переменная.

В этом случае вы можете передать snum как параметр «get» в одиночку с URL-адресом и получить параметр в новом окне.

Answer 2

Когда вы пишете

var snum; 

что просто создает переменную JavaScript.

Он даже не добавляет snum в DOM (Document Object Model) той же страницы. Что, что вы пытаетесь сделать (хотя на другой странице) с:

document.getElementById('stunb').value; 

Вы можете позвонить getElementById() только получить DOM узла/элемента, как узел абзаца <p id="mainText">. Чтобы обойти значения от одной страницы к другой вы можете использовать:

• Печенье
• параметры URL (как google.com/search?q= параметр + значение)

Есть другие методы, но для этого потребуется некоторый код на стороне сервера.

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

<form action="nextPage.html"> 
    Number of Students: <input type="text" name="snum" /> 
    <input type="submit" value="Next" /> 
</form> 

На nextPage.html

<script type="text/script"> 
<!-- 
    var snum = location.search.substr(location.search.indexOf("=")+1); 
    alert(snum); // assumes snum will be sent as "nextPage.html?snum=10" 
//--> 
</script> 

Answer 3

посмотреть в использовании печенье:

http://www.w3schools.com/js/js_cookies.asp

с ookie - это переменная, которая хранится на компьютере посетителя. Каждый раз, когда тот же компьютер запрашивает страницу с браузером, он отправляет cookie тоже. С помощью JavaScript вы можете создавать и получать значения cookie.

function savesnum(val) { 
    document.cookie = 'snum:'+val; //Set the cookie 
} 

function getsnum() { 
    var start = document.cookie.indexOf('snum:'); //Get the location of the cookie value 
    var stop = document.cookie.indexOf(';'); //Get the end of the cookie value 

    return document.cookie.substring(start+5, stop); //Return the value of the cookie (+5 because 'snum:' is 5 chars long) 
} 

Answer 4

Вот пример использования window.localStorage для передачи данных между двумя HTML-страниц, обслуживаемых на том же домене.Это не будет работать в разных доменах из-за Same-origin policy.

Пример состоит из двух страниц, размещенных на jsfiddle.net, но вы можете так же легко обслуживать эти файлы из локальной файловой системы. В этом примере нет связи с сервером.

Первая страница позволяет пользователю ввести текст в элементе textarea. Существует ворота button, который при нажатии на Сработает click event, который выполняет обработчик сохранения (anonymous function указан в качестве второго атрибута addEventListener), который получает введенный пользователем текст и сохраняет его в LocalStorage с ключом mySharedData

Page 1 on jsfiddle

HTML

<textarea id="input"></textarea> 
<div> 
    <button id="save">Save</button> 
</div> 

Javascript

/*jslint sub: true, maxerr: 50, indent: 4, browser: true */ 

(function (global) { 
    document.getElementById("save").addEventListener("click", function() { 
     global.localStorage.setItem("mySharedData", document.getElementById("output").value); 
    }, false); 
}(window)); 

Вторая страница ссылается на сохраненный текст из ключевых mySharedData, который находится в LocalStorage и отображает его в текстовое поле

Page 2 on jsfiddle

HTML

<textarea id="output"></textarea> 

Javascript

/*jslint sub: true, maxerr: 50, indent: 4, browser: true */ 

(function (global) { 
    document.getElementById("output").value = global.localStorage.getItem("mySharedData"); 
}(window)); 

Оба примера завернуты в анонимный closure, который выполняется ed, и в который мы передаем window object, который затем ссылается как переменная с именем global.

И, наконец, первая строка - это комментарий, но не старый комментарий; это инструкция, которая используется jslint; инструмент статического анализа кода, используемый в разработке программного обеспечения javascript для проверки того, соответствует ли исходный код JavaScript coding conventions, предложенному Дугласом Крокфордом.

Альтернативы будет использовать:

cookies, опять же политика общего происхождения будет применяться.

или

query-stringsURL, который будет частью адреса, используемого при приеме вас на следующую страницу, где он может быть прочитан в Javascript для получения данных.