|
|
Модератор форума: JonMagon |
Сообщество uCoz Вебмастеру JavaScript, Flash и прочие технологии Ajax Ajax - поиск (Или как создать поиск без перезагрузки) (Помогите вместе написать поиск товаров без перезагрузки стр.) |
Ajax - поиск (Или как создать поиск без перезагрузки) |
Здравствуйте уважаемые разработчики, пользователи и другие)))
Задался вопросом можно ли написать на ucoz поиск в котором можно при нажатии найти Выводился результат поиска без перезагрузки ( В отдельном <div id=result> ) Кто знает варианты воплощенные в жизнь напишите пожалуйста буду оч оч благодарен. |
|
Здравствуйте magistron, я тоже искал почти такой же скрипт, как вы описали, и нашёл этот:
JavaScript вставьте на страницу поиска: Код <script type="text/javascript"> // ajax переключатель страниц by Apocalypse var apohref; $(document).ready(function() { aposw(); };); function aposw() { $('a.swchItem, a.swchItem1').hover(function() { // При наведении удаляем событие онклик $(this).removeAttr('onclick'); };); $('a.swchItem, a.swchItem1').click(function() { apohref = $(this).attr('href'); $.get(apohref, function(apo) { var aposwt1 = $('.catPages1', apo).html(); var aposwt2 = $('.catPages2', apo).html(); var aposwtb1 = $('#pagesBlock1', apo).html(); var aposwtb2 = $('#pagesBlock2', apo).html(); var aposwtz1 = $('.pagesBlockuz1', apo).html(); var aposwtz2 = $('.pagesBlockuz2', apo).html(); var apocont = $('#apob', apo).html(); $('.catPages1').html(aposwt1); $('.catPages2').html(aposwt2); $('#pagesBlock1').html(aposwtb1); $('#pagesBlock2').html(aposwtb2); $('.pagesBlockuz1').html(aposwtz1); $('.pagesBlockuz2').html(aposwtz2); $('#apob').html(apocont); history.pushState(null, null, apohref); aposw(); };); return false; };); }; // apo-team (c) 2012 </script> Замените тег $BODY$ на: Код <div id="apob"> $BODY$ </div> Вот и всё! А также скрипт работает во всех модулях ucoz. :) |
заходишь в панель управления - управление дизайном - поиск - вид материалов и в самый конец добавляешь:
Код <div style="display:none;"> <div class="searchtitle"><fieldset style="border-bottom:none;border-left:none;border-right:none;"><legend><a href="$ENTRY_URL$">$TITLE$</a></legend><div class="messCheck">$MESSAGE$</div></fieldset></div><br> </div> далее создаем js файл с таким содержимом: Код /* * name: Быстрый поиск по сайту */ done = _uButton('', 'b', { style: 3, text: '<b>Поиск</b>', id: 'bSearch' };); // кнопка Поиск nextpage = _uButton('', 'b', { style: 3, text: '<b>Подгрузить</b> ещё', id: 'resulpage' };); // кнопка Поиск $('#typeSearch').click(function () { new _uWnd('crazySearch', 'Быстрый поиск', 500, 100, { align: 0, shadow: 0, close: 1, autosize: 1, maxh: 500, minh: 100, resize: 1, oncontent: function () { $('#bSearch').click(function () { $('#npage').hide(); $('.resul').html('<div align="center">Пожалуйста, подождите...</div>'); if ($('#tSearch').val().length >= 3) { $.get('/search/?q=' + $('#tSearch').val() + ';t=0;p=1;md=', function (data) { $('.resulPageq').html($('#qq', data).find('.pagesBlockuz1,data').html()) $('#npage').click(function () { $.get('/search/?q=' + $('#tSearch').val() + ';t=0;p=' + $('.resulPageq').find('.swchItem:last').attr('href').split('/')[4].split(';')[2].substr(2) + ';md=', function (data) { if ($('#qq', data).find('.pagesBlockuz1,data').text().indexOf('»') != -1) { $('#npage').show() } else { $('#npage').hide() } $('.resulPageq').html($('.pagesBlockuz1', data).html()) $('#qq', data).find('.searchtitle,data').each(function () { $('.resul').append($(this).html()); };); };); };); $('.resul').prepend().html(''); if ($('.swchItem').size() == '0') { $('#npage').hide() } else { $('#npage').show() } if ($('#qr', data).text().indexOf('0-0') != -1) { $('.resul').html('<div align="center">Результатов по запросу <b>' + $('#tSearch').val() + '</b> не найдено</div>'); } else { $('#qq', data).find('.searchtitle,data').each(function () { $('.resul').append($(this).html()); };); } _uWnd.alert('<center>' + $('#qr', data).html() + '</center>', 'Результат', { w: 300, h: 70, tm: 8000 };); _uWnd.getbyname('crazySearch').checksize(); };); } else { $('.resul').html('<div align="center">Слишком короткий запрос</div>'); _uWnd.getbyname('crazySearch').checksize(); } };); } }, '<div style="display:none" class="resulPageq"></div><div style="margin:8px;"><div style="overflow:hidden;"><div style="float:left;"><center><input type="text" id="tSearch" style="width:300px;"></center></div><div style="float:left;margin-left:5px;">' + done + '</div></div><hr>Быстрый поиск позволит вам найти нужный запрос в считанные секунды<hr><div class="resul" style="margin-top:6px;"></div><div align="center" style="display:none;" id="npage">' + nextpage + '</div></center></div>') };); далее в любое место на сайте вставьте вот этот код: Код <a href="javascript://" id="typeSearch"><b>Поиск по сайту</b></a><script type="text/javascript" src="http://ваш сайт/novyj_tekstovyj_dokument.js"></script> Пример можно посмотреть здесь |
| |||
| |||