Совсем недавно (3 мая) был зарелизен jQuery 1.6 и вот что нового появилось в этой js-библиотеке давайте и посмотрим.

Самое «веселое» то, что в новом релизе есть важные изменения, которые несовместимы с предыдущими версиями jQuery. И в результате при переходе на новую версию, вполне возможно, что придётся просматривать и изменять уже существующий код.

Вчера John Resig, создатель jQuery, в своём блоге известил о том, что он покидает Mozilla Corporation, а также рассказал о работе в корпорации и о своих планах на будущее.

jQuery однозначно стал стандартом в индустрии веб-дева. Есть много отличных js-фреймворков, которые заслуживают внимания, но jQuery поразил всех своей лёгкостью, изящностью, магией. Люди пишут с использованием jQuery, люди пишут плагины для jQuery, люди даже пишут статьи про jQuery, но мало кто знает (особенно из новичков), КАК устроен jQuery.

В этой статье проведем небольшой экскурс во внутренности этого фреймворка и разберем, что внутри.
Статья рассчитана на базовые знания Javascript. Задумайтесь и, если вы знаете, как написать клон jQuery, то, скорее всего, вы тут не найдёте ничего нового. Остальным — добро пожаловать под кат

Джон Резиг позавчера сообщил о выходе предпросмотровой версии будущей библиотеки jQuery 1.6.

Все заинтересованные программисты могут тотчас же скачать её да проверить, не хуже ли эта версия ведёт себя в их скриптах по сравнению с предыдущей. По-видимому, это одна из последних возможностей сообщить о багах, если что не так. Впереди ведь релиз.

Резиг прилагает довольно обширный список изменений в версии 1.6 RC 1, в основном сводящихся к исправлению ошибок (иногда довольно замысловатых), ко сглаживанию шероховатостей, к ускорению работы отдельных функций. Есть и заметные новинки. Помимо тех, которые я ужé упоминал в обзоре бета-версии, появилась возможность вызывать jQuery.noConflict() в любое время, а также новый метод jQuery.holdReady() для того, чтобы при необходимости можно было придержать наступление события ready.

Метод .animate() снабдили поддержкою deferred-интерфейса (см. [1], [2]), так что делается возможным простое навешивание такой функции, которая должна сработать опосля завершения всех анимаций:

$.when(
   $elements.animate(properties),
   $elements2.animate(properties2),
   …
).then(function(){
   …
});

Вы наверняка согласитесь, что эта новинка необыкновенно приятна, потому что совершенно избавляет в таких случаях от необходимости возёхаться.

В официальном блоге jQuery выложена новость о том, что близится появление jQuery 1.6 и, стало быть, бета-версия позволит всем желающим заранее проверить совместимость нового кода со своими приложениями, убедиться в отсутствии проблем, при необходимости сообщить об ошибках в новой версии, и так далее.

Код jQuery beta 1 доступен для скачивания из jQuery CDN.

Список изменений в этой версии состоит из 45 строк, упоминающих 47 решённых проблем. Большей частью они посвящены обезжучиванию (избавлению от багов) и отлаживанию (избавлению от лажи), но там есть и с полдесятка небезынтересных новинок:

• Подобно методу .bind(), методы .delegate() и .live() теперь приемлют false в качестве сокращения кода function(){return false;}.
   
• Методы .is() и .not() теперь умеют принимать элементы DOM и коллекции jQuery в качестве аргументов.
   
• Метод .clean() не будет воздействовать на элементы script, не имеющие типа «text/javascript».
   
• В методе .css() появилась поддержка строк, содержащих относительные значения.
   
• Новая функция requestAnimationFrame будет использоваться вместо прежней setInterval для анимаций, если она есть во браузере.

Очередной топик с обзором нескольких интересных плагинов jQuery.

Mobily Map

Позволяет сделать интерфейс, подобный google-картам, на основе собственных изображений (возможность перетаскивать, ставить маркеры на изображении, реагировать на нажатие по ним и др.).
Узнать больше (англ.) | Посмотреть в действии

Введение

Вышла уже четвертая альфа jQuery Mobile, сделавшая фреймворк более-менее стабильным и удобным в использовании. Единственное, чего пока сильно не хватает — хорошей документации. Например, сейчас там описан только стандартный workflow показывающий переходы по JQM страницам. Но что делать, если вы хотите загружать данные динамически?
^{Статья подразумевает, что у вас есть хотя бы небольшие представления о том, что такое javascript, как работает jQuery и JQM.}

Вчера была выпущена четвертая альфа версия мобильной версии популярного фреймворка jQuery Mobile. Как пишут сами разработчики — это последний альфа релиз. В новом релизе основной упор в работе был сделан на улучшение производительности, так же исправлено более 150 проблем из A3 и добавлены несколько новых фич.

Итак, поздравляю, вышла версия 1.5.2 так любимого многими JavaScript-фреймворка. Закрыто 19 тикетов

В блоге jQuery Mobile сообщается о выпуске 3 альфы версии 1.0 JavaScript-фреймворка для мобильных систем.
По сравнению со 2-ой альфой внесены следующие изменения:

Джон Резиг позавчера (24 февраля) объявил во блоге jQuery о выходе очередной версии jQuery, получившей номер 1.5.1. Для скачивания, как и всегда, доступны два варианта исходного кода: обыкновенный (212 килобайтов) и мини-вариант (уменьшается до 29 килобайтов, если обработать его gzip).

Резиг перечислил сорок два основных изменения, которые были внесены в эту версию jQuery. В основном они сводятся к обезжучиванию, к избавлению от багов. Но есть и одно видимое изменение — в jQuery.ajax() добавили три новые настройки:

1) Настройка isLocal управляет осознанием используемого протокола в качестве локального, то есть позволяет дополнить автораспознавание jQuery, которое в настоящее время считает локальными только те ресурсы, которые загружаются по протоколам «file», «*-extension» (например, «chrome-extension», см. баг 8152) и «widget».

2) Настройка mimeType позволяет переопределить MIME-тип, используемый в XHR.

3) Настройка xhrFields позволяет передать массив необходимых установок (для каждой указав fieldName и fieldValue, то есть имя и значение некоторого поля) в объект XHR. Скажем, можно придать withCredentials значение true, если понадобится запросить сервер из другого домена и послать туда логин, пароль и cookies (в MDC есть пример JS-кода без jQuery для Firefox — можете на этом примере постигнуть, что именно будет такой настройкою достигнуто).

Эта версия (jQuery 1.5.1) — первая из тех, которые поддерживают IE9 настоящим образом: все проблемы, ранее имевшиеся в работе с IE9, либо исправлены в jQuery, либо переданы разработчикам IE9 для исправления их в IE9.

Вопрос поиска хорошего flash-плеера с HTML-интерфейсом занимал и занимает многих. Только на хабре можно найти немало статей на похожую тему. Так сложилось, что для своих нужд я использовал Flowplayer с плагином Controlbar с официального сайта. И все же чего-то не хватало…

Однажды пришло решение – использовать удобство тем jQuery UI для стилизации элементов управления. Было очевидно, что писать плагин придется самому. Увидеть, что из этого получилось можно под катом.

^{*) На самом деле все равно сложно, но зато проще, чем было раньше.}

История началась с постановки задачи: нужно сделать анимированный баннер с примерно тридцатью объектами средствами HTML+javascript за один день. За день, конечно, баннер сделан не был, а был сделан за два усилиями трех человекодней. После выполнения задания осталась библиотека пакетной анимации, которую я назвал Scenario. О её доработанной версии я и хочу рассказать.

Основная идея библиотеки — собрать информацию обо всех анимируемых объектах в один сценарий и отправить его на выполнение. Один сценарий может быть исполнен сколько угодно раз или может быть модифицирован, поскольку представляет из себя обычную яваскриптовскую структуру.

Запуск сценария из любого места предельно прост:

var newScenario = [...];
$.scenario(newScenario, {
    complete: function(time) {
        alert('Готово!');
    }
});

Осталось только разобраться, что писать вместо трех точек в примере :)

Две недели назад я рассказал об основных возможностях плагина jQuery Templates и обещал на этом не останавливаться. Обещания надо выполнять, поэтому сегодня я расскажу о дополнительных функциях, не вошедших в основной код плагина.

Дополнительные функции плагина включают:

1. Набор команд, существенно упрощающих изменение отрендеренных шаблонов при изменении связанных с ними данных;
2. Событие rendered, которое вызывается после того, как отрендеренный шаблон добавляется в структуру документа.

Код дополнительных функций вынесен в файл jquery.tmplPlus.js, поэтому для их использования вы должны добавить ссылку на этот файл:

<script src="Scripts/jquery-1.5.js" type="text/javascript"></script>
<script src="Scripts/jquery.tmpl.js" type="text/javascript"></script>
<script src="Scripts/jquery.tmplPlus.js" type="text/javascript"></script>

31 января вышел релиз jQuery 1.5, одним из ключевых нововведений которого стал инструмент Deferred Object. Именно о нём я и хочу рассказать подробнее в этой статье.

Эта новая функциональность библиотеки направлена на упрощение работы с отложенными (deferred) вызовами обработчиков (callbacks). Deferred Object, аналогично объекту jQuery, «цепочный» (chainable), но имеет свой набор методов. Deferred Object способен регистрировать множество обработчиков в очередь, вызывать зарегистрированные в очереди обработчики и переключать состояние на «завершено» или «ошибка» для синхронных или асинхронных функций.

Deferred объекты появились в jQuery 1.5. Они позволяют отделить логику, которая зависит от результатов выполнения действия от самого действия. Для JavaScript Deferred объекты не новы, они уже были в MochiKit и Dojo, но с изменениями логики jQuery ajax от Julian Aubourg, внедрение Deferred объектов было неминуемо. С Deferred объектами несколько callback могут быть связаны с результатом задачи и любые из них могут быть привязаны к действию даже после начала его выполнения. Выполняемая задача может быть асинхронна, но не обязательно.

Deferred объекты теперь встроены в $.ajax() таким образом вы будете получать их автоматически. Обработчики теперь могут быть связаны с результатом следующим образом:

// $.get, ajax запрос, он асинхронный по умолчанию
var req = $.get('foo.htm')
   .success(function( response ){
      // что-нибудь делаем с ответом
   })
   .error(function(){
      // делаем что-нибудь если запрос провалился
   });
 
// это выполнится перед тем как $.get() будет выполнено
doSomethingAwesome();
 
// Делаем что-то ещё перед завершением запроса
req.success(function( response ){
   // делаем  что-то ещё с ответом
   // он будет выполнен когда запрос завершится, а если запрос завершен, то будет вызван немедленно
   // если запрос уже был выполнен
});

jQuery 1.5 готов для использования!

Этот долгожданный релиз вынудил приложить команду разработчиков немалые усилия. Поэтому, огромнейшее им спасибо!

Загрузка

Как правило, предлагается два варианта использования jQuery — минимизированная и распакованная (для отладки и изучения).

Введение

Плагин jQuery Templates – это «движок шаблонов», работающий на стороне клиента как расширение jQuery.

Этот плагин помогает показать в браузере данные, которые находятся в объектах и массивах JavaScript, избавляя вас от рутинных операций по созданию HTML-кода, экранированию специальных символов и т.п. Кроме того, он обладает очень интересными возможностями – например, позволяет обновлять созданный с его помощью HTML-код при изменении исходных данных.

Разумеется, jQuery Templates – не единственный и не первый «движок шаблонов», но у него есть большое преимущество перед альтернативными вариантами – поддержка со стороны jQuery Team. Это позволяет нам не бояться того, что этот плагин окажется заброшенным, и различные проблемы, возникающие при выходе новых версий браузеров, придется решать своими силами.

В этой статье я расскажу об основных возможностях jQuery Templates и продемонстрирую его работу в различных сценариях, а в последующих статьях я расскажу о функциях, не вошедших в основной код плагина (jQuery Templates Plus) и о расширении языка шаблонов.

Знаете ли вы, что с помощью jQuery можно загружать не только контент страницы, но и выбранного контейнера на ней? Оказывается можно и делается это следующим образом:

$("#area").load("something.html #content");

Данный код найдет на странице something.html контейнер с id content, возьмет его содержимое и загрузит в контейнер с id area. Но есть одно но…

Я уже писал про скрипт audio.js, позволяющий проигрывать аудио файлы использую возможности html5 и flash. Пост был встречен хорошо, поэтому сейчас я хочу рассказать про jPlayer — jQuery плагин для проигрывания аудио и видео.