Архив метки: JQuery

Полезные скрипты JavaScript

Несколько полезных скриптов.
Повесить обработчики на фрейме.
function Addhandler() { var input = window.frames['mainFrame'].document.getElementById('Lastname'); if (input == null) { return; } else { var inputs = window.frames['mainFrame'].document.getElementsByTagName('input'); } if (undefined !== inputs && inputs.length) { for (index = 0; index < inputs.length; ++index) { var input = inputs[index]; input.onkeyup = function (e) { var item; var itext = ''; itext = this.value.replace(' ', ''); itext = itext.replace('ё', 'е'); var items = [«тест», «привет»]; for (i = 0; i < items.length; ++i) { item = items[i].replace(' ', ''); item = item.replace('ё', 'е'); if (itext.toLowerCase() == item.toLowerCase()) { alert('Вы угадали секретное слово ' + itext + ' поздравляем'); } } } } } }

JavaScript, добавить обработчик на элемент
function Addhandler() { var inputs = document.getElementsByTagName(«input»); for (index = 0; index < inputs.length; ++index) { var input = inputs[index]; input.onkeyup = function (e) { var item; var itext = «»; itext = this.value.replace(» «, «»); itext = itext.replace(«ё», «е»); var items = [«тест», «привет»]; for (i = 0; i < items.length; ++i) { item = items[i].replace(» «, «»); item = item.replace(«ё», «е»); if (itext.toLowerCase() == item.toLowerCase()) { alert(alert('Вы угадали секретное слово ' + itext + ' поздравляем');  } } } }; }
Jquery, можно определить больше одного обработчика
function Addhandler() { $(document).ready(function () { $('input').each(function () { var element = $(this); var j = 0; var DomElement = element.get(0); var ev = $._data(DomElement, 'events'); if (ev != undefined && ev.keyup != undefined) { j = 1; } else { $(this).bind(«keyup«, function (e) { var item; var itext = «»; itext = this.value.replace(» «, «»); itext = itext.replace(«ё», «е»); var items = [«тест», «привет»]; for (i = 0; i < items.length; ++i) { item = items[i].replace(» «, «»); item = item.replace(«ё», «е»); if (itext.toLowerCase() == item.toLowerCase()) { alert('Вы угадали секретное слово ' + itext + ' поздравляем'); } } }); } }) }) }
Провер
ка ввода, должен работать с 9 версии IE
function Addhandler() { var newDiv = document.createElement('span');newDiv.className = 'myclass';newDiv.id = 'statemsg';newDiv.style.backgroundColor = 'red';document.body.appendChild(newDiv);var msg = document.getElementById('statemsg');document.body.addEventListener('keydown', function (e) {msg.textContent = 'keydown:' + e.keyCode;});document.body.addEventListener('keyup', function (e) {msg.textContent = 'keyup:' + e.keyCode;});document.body.addEventListener('keypress', function (e) {msg.textContent += 'keypress:' + e.keyCode;});}
Проверка клавиш для окна должен работать с 9 версии IE
function Addhandler() {document.body.addEventListener('keyup', function (e){var el = document.activeElement;var itext = «»;var item;if (el && (el.tagName.toLowerCase() == 'input' && el.type == 'text' ||el.tagName.toLowerCase() == 'textarea')) {itext = el.value.trim(); itext = itext.replace('ё', 'е');var items = [«тест», «привет»]; for (i = 0; i < items.length; ++i) {item = items[i].replace(' ', '');item = item.replace('ё', 'е');if (itext.toLowerCase() == item.toLowerCase()) { alert('Вы угадали секретное слово ' + itext + ' поздравляем'); } } }  });  }

Автор: Roman D
Дата публикации: 2016-04-13T07:53:00.001-07:00

Селекторы JQuery

Селекторы jQuery

Для изучения используйте jQuery Selector Tester
elements elements

Автор: Roman D
Дата публикации: 2016-04-01T01:51:00.000-07:00

Велосипеды на Javascript и jQuery

Интересная статья с habra. Полезно знать каждому.

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

http://habrahabr.ru/post/149237/

Автор: Sergiy Kamolov
Дата публикации: 2012-08-09T11:02:00.000+03:00

jQuery UI: Проблема отображения Datepicker в Dialog

Пытаясь встроить поле для даты, используя плагин Datepicker, в диалоговое окно, создаваемое плагином Dialog библиотеки jQuery UI обнаружил проблему. После открытия диалогового окна и выбора поля Datepicker — панель для выбора даты (календарик) отображается позади диалогового окна.

Решить данную проблему можно следующим образом: в CSS файле со стилями для Datepicker находим стиль для класа  .ui-datepicker  и заменяем его на следующий

.ui-datepicker { 
width: 17em; 
padding: .2em .2em 0; 
z-index: 9999 !important; 
}

Автор: Sergiy Kamolov
Дата публикации: 2011-05-25T14:48:00.009+03:00

Подсветка кода в блоге на Blogger.com (blogspot.com)

При публикации на страницах блога программного кода, возникает вопрос его красивого, и главное, доступного, оформления.

Существует множество скриптов и решений данного вопроса, но как организовать подсветку в блоге, размещенном на Blogger.com. Хочу поделиться парой доступных и простых решений, возможно кому то оно окажется полезным. Читать

Как установить SexyBookmarks на свой сайт?

 

SexyBookmarks — очень удобный плагин для WordPress, который позволяет пользователям делится закладками на страницы вашего сайта.

В данной заметке будет описано как установить SexyBookmarks на произвольный сайт, используя только Javascript.

Итак, для начала необходимо скачать и распаковать последнюю версию плагина.

Из всего архива нам понадобятся только несколько файлов:

  • js/sexy-bookmarks-public.js
  • css/style.css
  • images/shr-sprite.png

Далее, подключаем скрипт и файл стилей, перед тегом добавляем следующие строчки кода:

 

Выбираем подходящее место на странице для размещения кнопок и добавляем следующий HTML-код:

Осталось немного поправить Javascript. Открываем файл js/sexy-bookmarks-public.js и внутри обработчика jQuery(document).ready(function () {}) добавляем следующий код, для обработки событий, вызываемых при нажатии на каждую кнопку:

jQuery('.shr-bookmarks a.external').click(function() {

var url = encodeURIComponent(window.location.href), desc = »;

var title = document.title;
var description = $(«meta[name=description]»).attr(«content»);

switch(this.parentNode.className) {
case ‘shr-twitter’:
this.href += ‘?status=’ + title + ‘+-+’ + url;
break;
case ‘shr-linkedin’:
this.href += ‘shareArticle?mini=true&url=’+url+’&title=’+title+’&summary=’+description+’&source=CEEOA’;
break;
case ‘shr-facebook’:
this.href += ‘?t=’ + title + ‘&u=’ + url;
break;
case ‘shr-googlebuzz’:
this.href += ‘?message=’+title+’%0A’+description+’&url=’ +url;
break;
case ‘shr-digg’:
this.href += ‘?phase=2&title=’ + title + ‘&url=’ + url + ‘&desc=’ + description;
break;
case ‘shr-reddit’:
this.href += ‘?title=’ + title + ‘&url=’ + url;
break;
case ‘shr-delicious’:
this.href += ‘?title=’ + title + ‘&url=’ + url;
break;
case ‘shr-stumbleupon’:
this.href += ‘?title=’ + title + ‘&url=’ + url;
break;
case ‘shr-twittley’:
this.href += ‘?title=’ + title + ‘&url=’ + url + ‘&desc=’ + description + ‘&pcat=Internet&tags=’;
break;
case ‘shr-googlebookmarks’:
this.href += ‘?op=add&title=’ + title +’&desc=’+description+ ‘&bkmk=’ + url;
break;
case ‘shr-gmail’:
this.href += ‘?view=cm&tf=0&to=&su=’+title+’&body=’+description+’%0A%0A’+url+’&fs=1’;
break;
case ‘sexy-technorati’:
this.href += ‘?add=’ + url;
break;
case ‘shr-diigo’:
this.href += ‘?title=’ + title + ‘&url=’ + url + ‘&desc=’ + description;
break;
case ‘shr-blinklist’:
this.href += ‘?Action=Blink/addblink.php&Title=’ + title + ‘&Url=’ + url;
break;
case ‘shr-mixx’:
this.href += ‘?title=’ + title + ‘&page_url=’ + url + ‘&desc=’ + description;
break;
case ‘shr-newsvine’:
this.href += ‘?h=’ + title + ‘&u=’ + url;
break;
case ‘shr-yahoobuzz’:
this.href += ‘?submitHeadline=’ + title + ‘&submitUrl=’ + url + ‘&submitSummary=’ + description + ‘&submitCategory=science&submitAssetType=text’;
break;
}
});

Результат:

Автор: Sergiy Kamolov