Заполнение формы с методом GET
Добрый день!
По прежнему изучаю в качестве хобби JS, возник вопрос возможно ли заполнить форму через ссылку? Возможно я не совсем корректно задаю вопрос, поэтому постараюсь просто показать на примере чего хотелось бы добиться. Набросал вот свой простенький шаблончик, умноежение двух переменных с последующим выводом в другой инпут.. Вбиваю в инпуты 2 и 2 нажимаю "ок", получаю 4. Далее нажимаю сброс я вижу ссылку с Get запросом (другого способа получить эту ссыль я не нашел), на сколько я понимаю, (такого вида learn.html?a=2&b=2&c=4)... хочу чтобы я введя в адресную строку в ручную learn.html?a=4&b=4&c=16) в инпуты с соответствующими значениями... Возможно ли это или, то что запланировал бред? Делаю это в целях чтобы в дальейшем поделиться ссылкой с человеком, перейдя по которой он бы увидел проведенные ранее расчеты...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru">
<head>
<meta charset="utf-8">
<script>
function calc() {
var a = +(document.getElementById('a').value);
var b = +(document.getElementById('b').value);
var c = a * b;
//alert (c);
document.getElementById('c').value = c;
}
</script>
<body>
<form method="get">
<input name="a" id="a" type="text" value="" />
*
<input name="b" id="b" type="text" value="" />
=
<input name="c" id="c" type="text" value=""/>
<br />
<input name="btn" type="Button" value="OK" onclick="calc();"/>
<button class="btnres" onclick="javascript:location.reload()">Сброс</button>
</form>
</body>
</html>
|
var vars = {};
location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
vars[key] = value;
});
console.log(vars);
console.log(vars['a']);
console.log(vars['b']);
console.log(vars['c']);
в объекте vars у вас будут лежать get параметры |
А как мне сделать так чтобы в адресной строке начали отображаться get параметры, ибо пока я к примеру не нажму у себя onclick="javascript:location.reload()" в адресной строке голый URL, т.е. без параметров?
|
Цитата:
history.pushState({}, '', '?a=2&b=3');
|
Адрес - это святое, его так просто менять нельзя, поэтому не надо мучить адрес и хистори какие-то, все равно же жаба скрипит, пиши свои параметры в хеш и все будет оперативно обновляться следуя манипуляциям оператора. Хеш это все что идет после #
|
Vor_tex,
немного теории и примеров ( возможно поможет чем-то ) Майкл С. Миковски "Разработка одностраничных вэб-приложений" 3.6. Управление состоянием приложения - стр.124 |
В общем то я пытаю свои силы в этом http://skies-calc.ru - это импровизированный калькулятор талантов для одной игры (я сам понимаю что реализация не очень смотря с вашего уровня), но суть задачи моей в том я хотел бы получить ссылку которой я мог бы поделиться с другим человеком показав ему как распределены таланты у меня...
ссыль такого типа http://skies-calc.ru/?lvl=25&exp=9+9...amouflage= 10 |
Мне тут разъясняли некоторые аспекты близкого по тематике вопроса, может что полезно будет.
|
т.е. теоретически мне нужно будет написать обработчик той строки УРЛ правильно? тобишь после обработки я получу массив данных с которыми смогу работать...
тогда подскажите как мне по нажатию кнопки получить ссылку такого типа http://skies-calc.ru/?lvl=25&exp=9+9...amouflage= 10 ? ведь она в реальном времени при нажатии кнопок нынешнего интерфейса не изменяется... |
Вся эта тряхомудия приходит с сервера и на клиенте не обрабатывается и не меняется апще. На php есть функции работы с search string - так эта шняга называется. На js можно найти готовые решения. Эти параметры нужны если надо на сервер передавать что-то и там сохранять, а если не надо - то пиши в куки и сервер все прочитает потом.
|
| Часовой пояс GMT +3, время: 08:42. |