Заполнение списка и запись в cookie
Скрипт является развитием скрипта "Добавление и удаление элементов из списков". Отличием является то, что данные из списка можно записать в cookie браузера, а затем, при запуске скрипта, автоматически вывести их обратно в список.
После ввода элементов в список, нажать кнопку "Просмотр перед записью в cookie". Данные запишутся строкой в текстовое поле. После просмотра и редактирования нажать кнопку "Запись списка в cookie". Данные запишутся в cookie. После запуска скрипта данные автоматически выводятся обратно в список. Их можно редактировать в текстовом поле и повторно записывать в cookie. При этом, старая запись в cookie стирается.
<HTML>
<HEAD>
<TITLE>Добавление элементов в список и запись в cookie</TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<script type="text/javascript" src="/forum/cookies.js"></script>
<script type="text/javascript">
function focusElement() {
var elem = document.forms[0].myInput;
elem.focus();
}
//Библиотека cookies
function SetCookie (name, value, expires, path, domain, secure) {
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" +
expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
// Вспомогательная функция, используемая функцией getCookie()
function getCookieVal (offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
//Основная функция для определения значения cookie по имени
function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0)
break;
}
return null;
}
function DelCuk() {
var largeExpDate = new Date ();
largeExpDate.setTime(largeExpDate.getTime());
SetCookie('Cuk',Cuk,largeExpDate,myDomain);
document.write('<p align=center>' + "cookie удален" + '</p>');
}
//Запись в cookie
function AddCk() {
var Cuk=document.forms[0].myInput.value;
pathname = location.pathname;
myDomain = pathname.substring(0,pathname.lastIndexOf('/')) +'/';
// Установка параметра expire на год вперед.
var largeExpDate = new Date ();
largeExpDate.setTime(largeExpDate.getTime() + (365 * 24 * 3600 * 1000));
SetCookie('Cuk',Cuk,largeExpDate,myDomain);
document.forms[0].myInput.value=""
document.write('<p align=center>' + "Запись успешно произведена" + '</p>');
}
//Заполнение списка
function addList(){
valid = true;
document.forms[0].myInput.focus()
var list1 = document.getElementsByTagName('select')['list1'];
var li = document.createElement('option');
/*Запрещение ввода пустой строки */
if (document.forms[0].myInput.value<1)
return valid;
/* Ввод в список из текстового поля */
li.innerHTML =document.forms[0].myInput.value
list1.appendChild(li);
/* Очистка текстового поля */
document.form1.myInput.value=""
}
//Ввод массива в список
function addArr(){for (var i=0; i < arr.length;
i++){var li=document.createElement('option');
list1.appendChild(li);
li.innerHTML =arr[i]
}}
function addText(){var li = document.getElementsByTagName('option');
//Ввод всего списка с разделением элементов пробелами
for (var i=0; i < li.length; i++){
document.forms[0].myInput.value=document.forms[0].myInput.value+(li[i].value)+' '
}
//Удаление пробела в конце списка
document.forms[0].myInput.value = document.forms[0].myInput.value.slice(0,-1);
}
var Cuk = GetCookie('Cuk');
if (Cuk == null) {
Cuk = alert('cookie отсутствует');
} else {
pathname = location.pathname;
myDomain = pathname.substring(0,pathname.lastIndexOf('/')) +'/';
// Установка параметра expire на год вперед.
var largeExpDate = new Date ();
largeExpDate.setTime(largeExpDate.getTime() + (365 * 24 * 3600 * 1000));
var arr = Cuk.split(' ') // массив из Cuk; разделитель - пробел
}
</script>
</HEAD>
<BODY onload='addArr()'>
<form name="form1">
<br /><b>Ввод элементов технической системы</b><br />
<p><textarea name="myInput" value= "" cols="32" rows="5"></textarea></p>
<input type='button' value='Добавить элемент ТС в список'
onclick='addList()' style="margin-left: 25px";><br />
<input type=button value='Удалить элемент ТС из списка'
onClick="for(var i=0;i<form1.list1.length;i++)
if(form1.list1.options[i].selected==true)
form1.list1.options[i]= null" style="margin-left: 25px";><br />
<input type='button' value='Просмотр перед записью в cookie' onclick='addText()' style="margin-left: 25px";><br />
<b>Элементы ТС</b><br /><br />
<select size="5" multiple id="list1"></select><br />
<INPUT TYPE="button" VALUE="Запись в cookie" OnClick='AddCk()'><br />
<INPUT TYPE="button" VALUE="Удаление cookie" OnClick='DelCuk()'>
</form>
</BODY>
</HTML>
В следующем скрипте элементы напрямую записываются в cookie из списка.
После ввода элементов в список, нажать кнопку "Запись списка в cookie". Данные запишутся в cookie.
<HTML>
<HEAD>
<TITLE></TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style type="text/css">
<!--
#list{width: 70px;} /* Ширина списка в пикселах */
-->
</style>
<script type="text/javascript">
function focusElement() {
var elem = document.forms[n].myInput;
elem.focus();
}
function SetCookie (name, value, expires, path, domain, secure) {
document.cookie = name + "=" + escape(value) +
((expires) ? "; expires=" + expires.toGMTString() : "") +
((path) ? "; path=" + path : "") +
((domain) ? "; domain=" + domain : "") +
((secure) ? "; secure" : "")
}
// Вспомогательная функция, используемая функцией getCookie()
function getCookieVal (offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
//Основная функция для определения значения cookie по имени
function GetCookie (name, value) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0)
break;
}
return null;
}
function DelCuk(name) {
var largeExpDate = new Date ();
largeExpDate.setTime(largeExpDate.getTime());
if (name == Cuk){SetCookie('Cuk',Cuk,largeExpDate,myDomain)}
else{SetCookie('Cuk2',Cuk2,largeExpDate,myDomain)}
alert("cookie удалена");
}
//Запись в cuk
function AddCk(n,name) {
var li = document.forms[n].getElementsByTagName('option');
//Ввод всего списка с разделением элементов пробелами
var s = ""
for (var i=0; i < li.length; i++){s = s + (li[i].value)+' '}
//Удаление пробела в конце списка
s = s.slice(0,-1);
if (name==Cuk){SetCookie('Cuk',s,largeExpDate,myDomain)}else
{SetCookie('Cuk2',s,largeExpDate,myDomain)}
alert("Запись произведена");
}
//Заполнение списка
function addList(n){
valid = true;
document.forms[n].myInput.focus()
var list = document.forms[n].getElementsByTagName('select')['list'];
var option = document.createElement('option');
/*Запрещение ввода пустой строки */
if (document.forms[n].myInput.value<1)
return valid;
/* Ввод в список из текстового поля */
option.innerHTML =document.forms[n].myInput.value
/* Очистка текстового поля */
document.forms[n].myInput.value=""
document.forms[n].list.appendChild(option);
}
function addArr(){for (var i=0; i < arr.length;
i++){var li=document.createElement('option');
document.forms[0].list.appendChild(li);
li.innerHTML =arr[i]
}
}
var Cuk = GetCookie('Cuk')
pathname = location.pathname;
myDomain = pathname.substring(0,pathname.lastIndexOf('/')) +'/';
// Установка параметра expire на год вперед.
var largeExpDate = new Date ();
largeExpDate.setTime(largeExpDate.getTime() + (365 * 24 * 3600 * 1000));
var arr = Cuk.split(' ') // массив из Cuk; разделитель - пробел
</script>
</HEAD>
<BODY onload="addArr()">
<table name = "tb" width="" cellspacing="0" cellpadding="0"><tbody>
<tr>
<td width="" bgcolor="#ffffcc" id="first">
<center><form name="fm1">
<p><textarea name="myInput" value= "" cols="32" rows="1"></textarea></p>
<input type='button' value='Добавить элемент в список'
onclick='addList(0)' style="margin-left: 20px; width: 235px";><br />
<input type=button value='Удалить элемент из списка'
onClick="for(var i=0;i<fm1.list.length;i++)
if(fm1.list.options[i].selected==true)
fm1.list.options[i]= null" style="margin-left: 20px; width: 235px"><br /><br />
<b>Список элементов</b><br /><br />
<select size="15" id="list"></select><br />
<INPUT TYPE="button" VALUE="Запись списка в cookie" OnClick='AddCk(0,Cuk)'><br />
<INPUT TYPE="button" VALUE="Удаление cookie" OnClick='DelCuk(Cuk)'>
</form></center>
</td>
</tr>
</tbody></table>
</BODY>
</HTML>
|
invem, вы ошибочно пытаетесь перенести некоторые приемы кодинга из VB в js и усложняете некоторые задачи, у которых есть простое типовое решение.
Например, ф-ция setCookie. Забудьте про argv и argc. Вы можете указать все нужные параметры функции и в случае, если эти параметры не будут переданы, они примут значение undefined, которое при приведении к boolean даст false.
А чтобы не мучиться с конкатенацией строк, просто создаем массив, а затем склеиваем его в строку разделителем ';'.
ixth, спасибо за замечания. Библиотеку куков я взял готовую, особенно не вникая в ее содержание. Скрипт, конечно, надо переделать.
Вообще-то все изобрели до нас
Ввод элементов технической системы.
А что за техническая система упоминается в каждой вашей функции? К чему это?
Можно узнать, для чего написан код (в чём его польза)?
Техническая система (ТС) — совокупность материальных элементов (компонентов), предназначенная для удовлетворения какой-либо потребности человека.
Код написан для построения компонентной модели ТС. Компоненты — составные части ТС (для изделий — это сборочные единицы, детали и т.д.; для технологических процессов — технологические операции, переходы, оборудование, оснастка и др.). Компонентная модель (КМ) - это модель, отражающая состав объекта и иерархию (соподчиненность) его элементов.
Построение КМ - это этап функционально-стоимостного анализа (ФСА) объектов техники, как метода поиска и реализации наиболее целесообразных технико-экономических решений.
В целом мне хотелось бы создать набор скриптов для проведения ФСА.
Подробней о ФСА можно узнать в http://www.triz-summit.ru/ru/section.php?docId=3981.
Это наверное был риторический вопрос. Просто пока вашей ТС и не пахнет и вы можете вводить в заблуждение пользователей. Это всего лишь элементы интерфейса, не более того и используются (можете поверить наслово) не только для построения компонентной модели. Вот если бы выложили скрипт алгоритма работы самой программы, а не элементов ввода, тогда возможно идея и код были полезны в рамках этого сайта. Этот сайт, как вы можете заметить вверху главной страницы, предоставляет: "как можно более грамотную и структурированную информацию по языку javascript и смежным технологиям".
1) Если cookie пусты, то функция GetCookie возвращает null и последующее Cuk.split(':') - выкидывает исключение.
2) В функции addArr - невозможно получить list1, так как он объявляется в другой функции и даже если бы он объявлялся глобально, всё равно бы произошла бы ошибка, потому что addArr вызывается раньше addList.
И тому подобное. А ведь это основы. А так-же во всех браузерах уже давно есть баг панели. Пользуйтесь, не стесняйтесь
Большое спасибо за замечания. JS приходится изучать самому. Лучший способ изучения - это пытаться что-то создать. Первой задачей у меня было - получить желаемый результат. Постараюсь в ближайшее время навести порядок с грамотой.
С уважением,
invem
Ogłoszenia erotyczne warszawa
Co poza roksa
Отправить комментарий
Приветствуются комментарии:Для остальных вопросов и обсуждений есть форум.