Category Archives: javascript
Работа с событиями в jQuery-ui
Если нужно из виджета стриггерить событие, это сделать это можно двумя способами: this.element.trigger( ‘my_event_element’, { option1: true } ); this._trigger( ‘_my_event_widget’, null, { option1: true } ); Допустим, что наш виджет называется MyCoolWidget. Тогда поймать наши события можно так: $( ‘#div’ ).MyCoolWidget(); $( ‘#div’ ). bind( ‘my_event_element’, function( Event, Ui ) { console.dir( Ui ) …
Способ узнать, какие события забиндены на элементе в jQuery
console.log( $( selector ).data(‘events’) ); Выдаст все события, которые слушаются обработчиками на элементе.
Что почитать, чтобы повысить свой уровень JavaScript
От переводчика: Я думаю многие читали статью Rey Bango — What to Read to Get Up to Speed in JavaScript, но до хабра обсуждение так и не докатилось. Предлагаю закрыть этот пробел и поговорить о хороших книгах, блогах, тренингах и конференциях, посвященных в первую очередь клиентскому JavaScript и клиентской веб-разработке. Чтобы не копипастить оформляю статью в …
jQuery templates (расширение jQuery, шаблонизатор)
Всё достаточно просто. $.getJSON( me.options.urlMoreResults ) .success( function( Answer ) { $( ‘#my-tmpl’ ).tmpl( Answer ); } ); Шаблон: <script id=»my-tmpl» type=»text/x-jquery-tmpl»> <div> {{if songs}} <ul class=»song-list»> {{each songs}} <li> <a class=»play js-play» href=»javascript:void(0);» data-song=»${$value.id}»></a> </li> {{/each}} </ul> {{/if}} {{if description}} <div class=»description»> <a href=»${url}/about» target=»_blank»> ${description} </a> </div> {{/if}} </div> </script> http://api.jquery.com/category/plugins/templates/ http://habrahabr.ru/blogs/jquery/112843/ http://habrahabr.ru/blogs/jquery/113672/
jQuery — обработка событий с использованием Namespaced Events
Часто события навешиваются на элементы так: $(‘.class’).bind(‘click’, function(){}); А когда нужно снять обработчик события с элемента, то делается это так: $(‘.class’).unbind(‘click’); При этом слетят все обработчики события click с элемента. Можно снимать только конкретный обработчик, но это не очень удобно. Гораздо удобнее группировать обработчики в неймспэйсы по функциональности, а потом снимать обработчики всего неймспэйса: $(‘.class’).bind(‘click.namespace’, …
Передача параметров с сервера к jQuery. Продвинутый способ.
Старый способ передачи параметров с сервер-сайда на клиент-сайд для jQuery обычно выглядел так: <div class=»my-class» property1=»prop1-value» property2=»prop2-value»>текст</div> Потом в скрипте можно было обращаться к свойствам DOM-элемента var property1Initial = $( «.my-class» ).attr( «property1″ ); Есть более интересный способ, использующий jQuery data: <div class=»my-class» data-property1=»prop1-value» data-property2=»prop2-value»>текст</div> В скрипте можно обратиться к этим свойствам так: var property1Initial …
Сброс очереди анимации на элементе в jquery
Если нужно срочно прекратить анимацию (к примеру, как результат выполнения ajax-запроса), а она всё продолжается, то нужно сделать так: $el.queue(«fx», []); Такое может быть, когда на элементе есть сложная анимация, связанная с отображением элемента, а по результату ajax-запроса элемент нужно скрыть. Подробно об очередях — на сайте jquery
FireBug console.table
В FireBug1.6 появился новый способ вывода — console.table
Пример jquery-ui виджета
Виджет добавляет инпуту кнопки, упрощающие генерацию маски, и строку для показа сгенерированного по маске значения. Виджет выложен исключительно для примера. Использовать напрямую нельзя (только с моего письменного разрешения). К сожалению так, прошу извинить.
Динамическое добавление/удаление полей форм в Django
Задача стояла следующая: есть список сущностей (к примеру, упражнений), каждая из которых в форме выводится в виде нескольких полей ввода (к примеру, сеты и название упражнения), хочется иметь возможность яваскриптом добавлять/удалять упражнения, менять их положение. Для этого были использованы формсеты (django.forms.formsets) и jquery на клиенте. В теории всё так: в шаблон передаём формы из формсета …