Запись в куки

Damasc · 10 Фев 2011

На сайте стоит следующий код:

HTML:

<div style="position: fixed; bottom: 1px; right: 1px;">
<div id="chat" style="display: none;">
<table style="border: 1px solid rgb(199, 185, 148); background: none repeat scroll 0% 0% rgb(101, 89, 84);" border="0" cellpadding="0" cellspacing="0" width="230">
<tbody><tr><td style="background: none repeat scroll 0% 0% rgb(101, 89, 84); text-align: center; border-top: 1px solid rgb(199, 185, 148);">
<!-- BEGIN CBOX - www.cbox.ws - v001 -->
<div id="cboxdiv" style="text-align: center; line-height: 0">
<div><iframe frameborder="0" width="227" height="315" src="http://www4.cbox.ws/box/?boxid=3885086&amp;boxtag=5647yb&amp;sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain" style="border:#ababab 1px solid;" id="cboxmain"></iframe></div>
<div><iframe frameborder="0" width="227" height="75" src="http://www4.cbox.ws/box/?boxid=3885086&amp;boxtag=5647yb&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform" style="border:#ababab 1px solid;border-top:0px" id="cboxform"></iframe></div>
</div>
<!-- END CBOX -->
</td></tr></tbody></table>
</div>
<div style="height: 22px; width: 229px; border: 1px solid rgb(199, 185, 148); background: none repeat scroll 0% 0% rgb(101, 89, 84); margin-top: 1px;">
<div style="float: right; height: 18px; width: 48px; border-left: 1px solid rgb(199, 185, 148); text-align: center; padding-top: 4px;"><font color="gray"><span class="xml-text">{date}</span></font></div>
<div style="float: left; padding-top: 3px;">
</div>
<div style="margin-top: 4px; text-align: center;"><a href="javascript://" onclick="$('#chat').slideToggle(2000)"><img src="{THEME}/images/mini-chat.png" title="Мини чат" border="0" height="15" width="100"></a></div>
</div> </div>

Это мини чат, похожий на чат фейсбука. Хочу сделать запись в куки браузера при открытия чата. Нужно чтобы после обновления странички чат оставался открытым (если его открыли естественно).
Запись в куки видел на сайте _dirvideo.com (смотрите блок "Опрос на сайте")
_dirvideo.com/templates/dirvideo_v3/js/cookie.js - записывает в куки.
Можно это прикрутить к моему чату?

Djutan · 10 Фев 2011

Подключаешь .js файл с такими функциями:
Для установики куки:

HTML:

function setCookie(name, value) { 
      var valueEscaped = escape(value); 
      var expiresDate = new Date(); 
      expiresDate.setTime(expiresDate.getTime() + 365 * 24 * 60 * 60 * 1000); // срок хранения куки, устанавливается в милисекундах, в данном случае установлена на 1 год 
      var expires = expiresDate.toGMTString(); 
      var newCookie = name + "=" + valueEscaped + "; path=/; expires=" + expires; 
      if (valueEscaped.length <= 4000) document.cookie = newCookie + ";"; 
}

Для чтения куки:

HTML:

function getCookie(name) { 
      var prefix = name + "="; 
      var cookieStartIndex = document.cookie.indexOf(prefix); 
      if (cookieStartIndex == -1) return null; 
      var cookieEndIndex = document.cookie.indexOf(";", cookieStartIndex + prefix.length); 
      if (cookieEndIndex == -1) cookieEndIndex = document.cookie.length; 
      return unescape(document.cookie.substring(cookieStartIndex + prefix.length, cookieEndIndex)); 
}

UDAV · 10 Фев 2011

в раздел по программированию. ага)

Damasc · 11 Фев 2011

Не получилось по вашему способу.

Кто подскажет более подробно? На основе _dirvideo.com/templates/dirvideo_v3/js/cookie.js можно сделать это? На этом сайте работает превосходно, только применить это чате мне не удалось.

p1kka · 11 Фев 2011

Для просмотра ссылки Войди или Зарегистрируйся
отличный и очень простой плагин для записи,чтения кукисов jquery

Damasc · 11 Фев 2011

p1kka написал(а):
Для просмотра ссылки Войди или Зарегистрируйся
отличный и очень простой плагин для записи,чтения кукисов jquery

Скачал, посмотрел. Так и не понял как им воспользоваться. Файлик README пуст, а в файле test.html я так и не понял как должен работать скрипт и как его там можно протестировать.

Djutan · 11 Фев 2011

Damasc написал(а):
Не получилось по вашему способу.

Damasc написал(а):
Кто подскажет более подробно? На основе _dirvideo.com/templates/dirvideo_v3/js/cookie.js можно сделать это? На этом сайте работает превосходно, только применить это чате мне не удалось.

Damasc написал(а):
Скачал, посмотрел. Так и не понял как им воспользоваться. Файлик README пуст, а в файле test.html я так и не понял как должен работать скрипт и как его там можно протестировать.

Так у вас ничего не получится никаким способом. Нужно еще подключить голову. Это я не в плане нравоучений говорю, а хочу чтобы вы поняли - не заработает если бездумно "что то" "откуда то" скопировать и "куда то вставить".
В первом посте я вам написал 2 рабочие функции. Вам нужно разобраться, как через них происходит обращение к кукам. Ниже привожу готовую страницу с "песочницей". Разберитесь по коду, как там исполюзуются эти функции, ничего сложного там нет.

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript"><!--
function setCookie(name, value) { 
      var valueEscaped = escape(value); 
      var expiresDate = new Date(); 
      expiresDate.setTime(expiresDate.getTime() + 2* 60 * 1000); // 365 * 24 * 60 * 60 * 1000 срок хранения куки, устанавливается в милисекундах, в данном случае установлена на 2 минуты 
      var expires = expiresDate.toGMTString(); 
      var newCookie = name + "=" + valueEscaped + "; path=/; expires=" + expires; 
      if (valueEscaped.length <= 4000) document.cookie = newCookie + ";";
}
function getCookie(name) { 
      var prefix = name + "="; 
      var cookieStartIndex = document.cookie.indexOf(prefix); 
      if (cookieStartIndex == -1) return null; 
      var cookieEndIndex = document.cookie.indexOf(";", cookieStartIndex + prefix.length); 
      if (cookieEndIndex == -1) cookieEndIndex = document.cookie.length; 
      return unescape(document.cookie.substring(cookieStartIndex + prefix.length, cookieEndIndex)); 
}
function generate_set_cook() {
	elem_name = document.getElementById("cook_name").value;
	elem_value = document.getElementById("cook_value").value;
	elem_time = document.getElementById("cook_time").value;
	setCookie(elem_name, elem_value);
	alert("Кука "+elem_name+" установлена!");
}
function generate_get_cook() {
	result_name_elem = document.getElementById("result_name").value;
	if (result_name_elem == '') {
		alert("НЕ ЗАДАНО ИМЯ ПОЛУЧАЕМОЙ КУКИ!");
		return;
	}
	result_value_elem = document.getElementById("result_value");
	cookie = getCookie(result_name_elem);
	if(cookie == null){
		alert("Кука с таким именем не установлена, \n возможно истекло время жизни.");
		return;
	}
	result_value_elem.value = cookie;
	alert(cookie);
}
//--></script>
<style type="text/css">
html, body {
	height: 100%;
	margin: 0;
	padding: 0;
}
body {
	background:#fff;
	color:#000;
	font-family:arial,sans-serif;
	font-size:10px;
}
form {
	margin: 0;
	padding: 0;
}
.wrap {
	height:100%;
	text-align: center;
}
.sform {
	display: inline-block;
	display: inline !ie;
	border: 1px solid #DDD;
	background-color: #EEE;
	padding: 10px 10px 0 10px;
	text-align: left;
	zoom:1;
}
	.set_cook {
		display: inline !ie;
		padding-bottom: 10px;
		vertical-align: bottom;
		zoom:1;
	}
		.input_feeld {
			float: left;
			padding-right: 10px;
		}
		input.action {
			background: #bbb;
		}
		input#cook_time {
			background: #eee;
		}
.sform div {
	margin: 0px;
	text-align: left;
}
.sform div span {
	padding-right: 0px;
}
.sform a {
	text-decoration: none;
	color: #000;
	text-decoration: none;
	border-bottom: 1px dotted #000;
}
input {
	background: #ddd;
	border: 1px solid #DDD;
	color: #666;
}
input.text {
	background: #fff;
}
.helper {
	display:-moz-inline-box; 
	display:inline-block; 
	height:100%; 
	vertical-align:middle; 
	zoom:1; 
	display:inline !ie;
}
.clearfix:after {       
    clear: both;
    display: block;
    visibility: hidden;
    height: 0;
    content: ".";
    line-height: 0;
    font-size: 0;
}
.clearfix {
    *zoom: 1; 
    _height: 1%; 
}
</style>
</head>
<body>
<div class="wrap">
	<div class="sform">
			<div class="set_cook clearfix">
				<div class="input_feeld">
					<div><span>Имя куки</span></div>
					<input type="text" name="cook_name"  maxlength="10" size="10" value="My_cook" class="text" id="cook_name"> 
				</div>
				<div class="input_feeld">
					<div><span>Значение куки</span></div>
					<input type="text" name="cook_value"  maxlength="10" size="10" value="100$" class="text" id="cook_value"> 
				</div>
				<div class="input_feeld">
					<div><span>Время жизни (мин.)</span></div>
					<input type="text" name="cook_time"  maxlength="10" size="10" value="2" class="text" disabled id="cook_time"> 
				</div>
				<input type="button" value="Установить куку" onclick="generate_set_cook();" class="action">
			</div>
			<!--[if IE]><br/><![endif]-->
			<div class="set_cook clearfix">
				<div class="input_feeld">
					<div><span>Имя куки</span></div>
					<input type="text" name="result_name"  maxlength="10" size="10" value="" class="text" id="result_name"> 
				</div>
				<div class="input_feeld">
					<div><span>Значение куки</span></div>
					<input type="text" name="result_value"  maxlength="10" size="10" value="" class="text" id="result_value"> 
				</div>
				<input type="button" value="Получить куку" onclick="generate_get_cook();" class="action">
			</div>
	</div>
	<div class="helper"></div>
</div>
</body>
</html>

Damasc · 13 Фев 2011

>На примере всё понятно, не могу понять каким образом это можно использовать в моём случае?

Я так понимаю никто не знает как это сделать?

Запись в куки

Damasc

Участник

Djutan

Создатель

UDAV

Постоялец

Damasc

Участник

p1kka

Постоялец

Damasc

Участник

Djutan

Создатель

Damasc

Участник