KRYLOVblog

Рубрика

Javascript

Всего: 200 записей

jquery: .html input select value

JavascriptНет комментариев

Для получения содержимого блока с заполненными полями в форме.

$("input").each(function(){
	$(this).attr("value", $(this).val());
});
$("select").each(function(){
	var val=$(this).val();
	$("option[value='"+val+"']", this).attr('selected', 'selected');
});
var Content=$('#Content').html();

Использовалось для печати блока с формой, чтобы поля оставались заполненными: http://krylov.org.ua/?p=756

javascript: работа с cookies

JavascriptНет комментариев

Функции для записи, чтения, очистки cookies:

function createCookie(name,value,days) {
	if (days) {
		var date = new Date();
		date.setTime(date.getTime()+(days*24*60*60*1000));
		var expires = "; expires="+date.toGMTString();
	}
	else var expires = "";
	document.cookie = name+"="+value+expires+"; path=/";
}
function readCookie(name) {
	var nameEQ = name + "=";
	var ca = document.cookie.split(';');
	for(var i=0;i < ca.length;i++) {
		var c = ca[i];
		while (c.charAt(0)==' ') c = c.substring(1,c.length);
		if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
	}
	return null;
}
function eraseCookie(name) {
	createCookie(name,"",-1);
}

подробнее: http://www.quirksmode.org/js/cookies.html

javascript: выделение активного элемента списка

JavascriptНет комментариев

Понадобилось для выделения активного элемента навигации по странице.
Скрипт в заголовке страницы (суть работы в том что по клику по ссылке активному элементу дописываем class active):

<script type="text/javascript">
	function RPClass(el) {
		var nav=document.getElementById('nav');
		var links=nav.getElementsByTagName('li');
		for (var i=0;i<links.length;i++) {
			var li=links[i];
			li.className='';
		}
		el.className = 'active';
	}
</script>

Собственно список:

<ul id='nav'>
	<li onclick='RPClass(this);'><a href='#1'>1</a></li>
	<li onclick='RPClass(this);'><a href='#2'>2</a></li>
	<li onclick='RPClass(this);'><a href='#3'>3</a></li>
	<li onclick='RPClass(this);'><a href='#4'>4</a></li>
	<li onclick='RPClass(this);'><a href='#5'>5</a></li>
</ul>

Пример CSS для горизонтального меню с выделением активного элемента рамкой и фоном:

#nav {
	list-style:none;
}
#nav li {
	float:left;
	padding:10px;
	border:1px solid #ffffff;
	margin-right:4px;
}
#nav li:hover, #nav li.active{
	border:1px solid #505050;
	background:#dddddd;
}
#nav li a {
	color:#505050;
	text-decoration:none;
}