15 избранных фрагментов jQuery

Улучшите ваши проекты JavaScript с помощью этих классных фрагментов jQuery. Некоторые из них поддерживаются в jQuery версии 1.4.2. Это очень полезные функции или методы, которые могут помочь вам лучше и быстрее работать.

1. Правильное использование ToggleClass

//Toggle class allows you to add or remove a class
	 //from an element depending on the presence of that
	 //class. Where some developers would use:

	 a.hasClass('blueButton') ? a.removeClass('blueButton') : a.addClass('blueButton');

	 //toggleClass allows you to easily do this using

	 a.toggleClass('blueButton');

2. Раздел страницы Автопрокрутка

 jQuery.fn.autoscroll = function(selector) {
  $('html,body').animate(
    {scrollTop: $(selector).offset().top},
    500
  );
}

//Then to scroll to the class/area you wish to get to like this:
$('.area_name').autoscroll();

3. Автоматически скрывать или закрывать элементы

 //Here's how we used to do it in 1.3.2 using setTimeout
    setTimeout(function() {
  $('.mydiv').hide('blind', {}, 500)
}, 5000);

//And here's how you can do it with 1.4 using the delay() feature (this is a lot like sleep)
$(".mydiv").delay(5000).hide('blind', {}, 500);

4. Центральный элемент на экране

 jQuery.fn.center = function () {
	this.css('position','absolute');
	this.css('top', ( $(window).height() - this.height() ) / +$(window).scrollTop() + 'px');
	this.css('left', ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + 'px');return this;}
	//Use the above function as: $(element).center();

5. Снятие HTML с элемента

 (function($) {
    $.fn.stripHtml = function() {
        var regexp = /< ("[^"]*"|'[^']*'|[^'">])*>/gi;
        this.each(function() {
            $(this).html(
                $(this).html().replace(regexp,”")
            );
        });
        return $(this);
    }
})(jQuery);

	//usage:
	$('p').stripHtml();

6. Принудительно открывать ссылки во всплывающем окне.

 jQuery('a.popup').live('click', function(){
	newwindow=window.open($(this).attr('href'),'','height=200,width=150');
	if (window.focus) {newwindow.focus()}
	return false;
});

7. Принудительно открывать ссылки в новой вкладке

 jQuery('a.newTab').live('click', function(){
	newwindow=window.open($(this).href);
	jQuery(this).target = "_blank";
	return false;
});

8. Добавьте HTML к элементу

 $('#lal').append('sometext');

9. Определить браузер

 Detect Safari (if( $.browser.safari)),
	Detect IE6 and over (if ($.browser.msie && $.browser.version > 6 )),
	Detect IE6 and below (if ($.browser.msie && $.browser.version < = 6 )),
	Detect FireFox 2 and above (if ($.browser.mozilla && $.browser.version >= '1.8' ))

10. Определите пользовательский селектор

 $.expr[':'].mycustomselector = function(element, index, meta, stack){
    // element- is a DOM element
    // index - the current loop index in stack
    // meta - meta data about your selector
    // stack - stack of all elements to loop

    // Return true to include current element
    // Return false to explude current element
};

// Custom Selector usage:
$('.someClasses:test').doSomething();

11. Показать или удалить значение по умолчанию в поле ввода

 //This snippet will show you how to keep a default value
//in a text input field for when a user hasn't entered in
//a value to replace it

swap_val = [];
$(".swap").each(function(i){
    swap_val[i] = $(this).val();
    $(this).focusin(function(){
        if ($(this).val() == swap_val[i]) {
            $(this).val("");
        }
    }).focusout(function(){
        if ($.trim($(this).val()) == "") {
            $(this).val(swap_val[i]);
        }
    });
});

12. Разбор XML с помощью jQuery.

 function parseXml(xml) {
	//find every Tutorial and print the author
	$(xml).find("Tutorial").each(function()
	{
	$("#output").append($(this).attr("author") + "");
	});
}

13. Проверьте, было ли изображение полностью загружено

 $('#theImage').attr('src', 'image.jpg').load(function() {
alert('This Image Has Been Loaded');
});

14. Проверьте, включены ли Cookies или нет

 var dt = new Date();
    dt.setSeconds(dt.getSeconds() + 60);
    document.cookie = "cookietest=1; expires=" + dt.toGMTString();
    var cookiesEnabled = document.cookie.indexOf("cookietest=") != -1;
    if(!cookiesEnabled)
	{
        //cookies have not been enabled
    }

15. Замените любой URL кликабельной ссылкой.

 $.fn.replaceUrl = function() {
        var regexp = /((ftp|http|https)://(w+:{0,1}w*@)?(S+)(:[0-9]+)?(/|/([w#!:.?+=&%@!-/]))?)/gi;
        this.each(function() {
            $(this).html(
                $(this).html().replace(regexp,'$1‘)
            );
        });
        return $(this);
    }

	//usage

	$('p').replaceUrl();