![]() |
|
|
Регистрация Восстановить пароль |
Регистрация | Задать вопрос |
Заплачу за решение |
Новые сообщения |
Сообщения за день |
Расширенный поиск |
Правила |
Всё прочитано |
![]() |
|
Опции темы | Поиск в этой теме |
![]() |
#1 |
Новичок
Джуниор
Регистрация: 21.10.2012
Сообщений: 1
|
![]()
Здравствуйте, скачал такой вот скрипт http://www.rudebox.org.ua/filter-items-using-jquery/ для сортировки данных в небольшой доске объявлений.
Там два фильтра, первый сортирует по имени, т.е. что было задано в value радио кнопки, то и он будет сортировать, ориентируясь по классу блоков с данными в теге <ul>. А вот во втором проблема, ведь он сортирует по имени и размеру, при том, вычисляет это он в скрипте сам, без ключевых слов, опираясь на данные из <strong> и <span data-type="size"> в теге <li> каждого блока. Мне же надо, чтобы второй скрипт был как и первый, но они смешивали себя и выдавали общий результат, например, Москва+Недвижемость. Я понял кажется как работает скрипт, но не знаю этого языка, и не получается никак сделать такое... Вот куски с главным содержимым, плюс библиотеки, которые показывают на сайте, для движения блоков. Категории с радио кнопками Код HTML:
<form id="filter"> <div class="menu">Все<input type="radio" name="type" value="all" checked="checked"></div> <div class="menu">Недвижемость<input type="radio" name="type" value="realty"></div> <div class="menu">Мебель<input type="radio" name="type" value="furniture"></div> <div class="menu">Бытовая техника<input type="radio" name="type" value="appliances"></div> <div class="menu">Потери и находки<input type="radio" name="type" value="found"></div> <div class="menu">Отдам в дар<input type="radio" name="type" value="gift"></div> <div class="menu">Работа<input type="radio" name="type" value="work"></div> <div class="menu">Прочее<input type="radio" name="type" value="other"></div> <div class="menu">Размеру<input type="radio" name="sort" value="size"></div> <div class="menu">Названию<input type="radio" name="sort" value="name" checked="checked"></div> </form> Код HTML:
<ul id="applications" class="image-grid"> <li data-id="id-1" data-type="util"> <img src="img/activity-monitor.png" width="128" height="128" alt="" /> <strong>Adobe Photoshop</strong> <span data-type="size">1500 KB</span> </li> <li data-id="id-2" data-type="realty"> <img src="img/address-book.png" width="128" height="128" alt="" /> <strong>Google Chrome</strong> <span data-type="size">1904 KB</span> </li> <li data-id="id-3" data-type="app"> <img src="img/finder.png" width="128" height="128" alt="" /> <strong>File Browser</strong> <span data-type="size">1337 KB</span> </li> <li data-id="id-4" data-type="app"> <img src="img/front-row.png" width="128" height="128" alt="" /> <strong>Flash Get</strong> <span data-type="size">401 KB</span> </li> <li data-id="id-5" data-type="app"> <img src="img/google-pokemon.png" width="128" height="128" alt="" /> <strong>Internet Explorer</strong> <span data-type="size">12875 KB</span> </li> </ul> Код HTML:
<script type="text/javascript"> // Плагин сортировки (function($) { $.fn.sorted = function(customOptions) { var options = { reversed: false, by: function(a) { return a.text(); } }; $.extend(options, customOptions); $data = $(this); arr = $data.get(); arr.sort(function(a, b) { var valA = options.by($(a)); var valB = options.by($(b)); if (options.reversed) { return (valA < valB) ? 1 : (valA > valB) ? -1 : 0; } else { return (valA < valB) ? -1 : (valA > valB) ? 1 : 0; } }); return $(arr); }; })(jQuery); // Выполняется после загруки DOM $(function() { // привязыываем радиокнопки в форме var $filterType = $('#filter input[name="type"]'); var $filterSort = $('#filter input[name="sort"]'); // получаем первый набор var $applications = $('#applications'); // клонируем первый набор, чтобы получить второй набор var $data = $applications.clone(); // вызываем Quicksand для каждого изменения в форме $filterType.add($filterSort).change(function(e) { if ($($filterType+':checked').val() == 'all') { var $filteredData = $data.find('li'); } else { var $filteredData = $data.find('li[data-type=' + $($filterType+":checked").val() + ']'); } // если нужна сортировка по размеру if ($('#filter input[name="sort"]:checked').val() == "size") { var $sortedData = $filteredData.sorted({ by: function(v) { return parseFloat($(v).find('span[data-type=size]').text()); } }); } else { // если нужна сортировка по имени var $sortedData = $filteredData.sorted({ by: function(v) { return $(v).find('strong').text().toLowerCase(); } }); } // вызываем плагин $applications.quicksand($sortedData, { duration: 800, easing: 'easeInOutQuad' }); }); }); </script> |
![]() |
![]() |
![]() |
![]() |
||||
Тема | Автор | Раздел | Ответов | Последнее сообщение |
Смешивание двух RGBA цветов | Dj_smart | Мультимедиа в Delphi | 7 | 01.03.2012 20:35 |
Смешивание цвета в области перекрытия двух однотонных 3d фигур | Trinock | Gamedev - cоздание игр: Unity, OpenGL, DirectX | 2 | 15.02.2012 16:59 |
Смешивание | AngelOfDeathSX | Мультимедиа в Delphi | 1 | 16.10.2010 21:32 |
Смешивание деталей изображения после разделения | Юлия_ZZZZ | Помощь студентам | 2 | 30.04.2010 18:47 |