Прокрутка на начало страницы
$("a[href='#top']").click(function() {
$("html, body").animate({ scrollTop: 0 }, "slow");
return false;
});
Дублирование заголовков колонок на конце таблицы
var $tfoot = $('<tfoot></tfoot>');
$($('thead').clone(true, true).children().get().reverse()).each(function(){
$tfoot.append($(this));
});
$tfoot.insertAfter('table thead');
Оформление таблицы в стиле "зебра"
$(document).ready(function(){
$("table tr:even").addClass('stripe');
});
Предзагрузка фото
$.preloadImages = function() {
for(var i = 0; i < arguments.length; i++) {
$("<img />").attr("src", arguments[i]);
}
}
$(document).ready(function() {
$.preloadImages("hoverimage1.jpg","hoverimage2.jpg");
});
Открытие сторонних ссылок в новом окне
$('a').each(function() {
var a = new RegExp('/' + window.location.host + '/');
if(!a.test(this.href)) {
$(this).click(function(event) {
event.preventDefault();
event.stopPropagation();
window.open(this.href, '_blank');
});
}
});
Изменение размера блока в зависимости от области видимости
Создание div-а, размеры которого будут равны размерам окна. Замечательный сниппет для модальных окон.
var winWidth = $(window).width();
var winHeight = $(window).height();
// выставляем свойства height / width
$('div').css({
'width': winWidth,
'height': winHeight,
});
// меняем размеры блока при изменении размеров страницы
$(window).resize(function(){
$('div').css({
'width': winWidth,
'height': winHeight,
});
});
Проверка надежности пароля
HTML
<input type="password" name="pass" id="pass" /> <span id="passstrength"></span>
Надёжность вычисляется с помощью регулярных выражений. Возможные варианты: надёжный, средний, слабый, или недостаточно символов.
$('#pass').keyup(function(e) {
var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g");
var mediumRegex = new RegExp("^(?=.{7,})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g");
var enoughRegex = new RegExp("(?=.{6,}).*", "g");
if (false == enoughRegex.test($(this).val())) {
$('#passstrength').html('More Characters');
} else if (strongRegex.test($(this).val())) {
$('#passstrength').className = 'ok';
$('#passstrength').html('Strong!');
} else if (mediumRegex.test($(this).val())) {
$('#passstrength').className = 'alert';
$('#passstrength').html('Medium!');
} else {
$('#passstrength').className = 'error';
$('#passstrength').html('Weak!');
}
return true;
});
Автоматическое обновление контента в определенном блоке
setInterval(function() {
$("#refresh").load(location.href+" #refresh>*","");
}, 10000); // ожидание в миллисекундах
Проверить, загрузилось ли изображение
var imgsrc = 'img/image1.png';
$('<img/>').load(function () {
alert('image loaded');
}).error(function () {
alert('error loading image');
}).attr('src', imgsrc);
Доступ к содержимому IFRAME
$(function(){
var iFrameDOM = $("iframe#someID").contents();
//Теперь мы можем использовать find() для доступа к элементам iframe:
//например
iFrameDOM.find(".message").slideUp();
});