7 мая 2018
Нет комментариев
Для имитации клика по якорю:
$('.element').on('click',function(){ document.location.href='#anchor'; });
Для имитации клика по якорю:
$('.element').on('click',function(){ document.location.href='#anchor'; });
В примере нужно разделить категории и товары в autocomplete. Категории в теге <b>, товары без.
$.widget("custom.groupautocomplete",$.ui.autocomplete,{ _create:function(){ this._super(); this.widget().menu("option","items",">:not(.ui-autocomplete-group)"); }, _renderMenu:function(ul,items){ var self=this; var is_bold=0; $.each(items,function(index,item){ if(item.label.indexOf("<b>")!=-1){ if(is_bold!=1){ ul.append("<li class='ui-autocomplete-group'>Категории по запросу:</li>"); } is_bold=1; } else{ if(is_bold!=0){ ul.append("<li class='ui-autocomplete-group'>Товары по запросу:</li>"); } is_bold=0; } self._renderItemData(ul,item); }); }, _renderItem:function(ul,item){ var bold=''; if(item.label.indexOf("<b>")!=-1){ bold=' class="category"'; } return $("<li"+bold+"></li>").data("item.autocomplete",item).append(item.label.replace(/(<([^>]+)>)/ig,"")).appendTo(ul); } }); $("#search").groupautocomplete({ source:"/ajax_search.php", minLength:3, select:function(event,ui){ event.preventDefault(); $(this).val(ui.item.value.replace(/(<([^>]+)>)/ig,"")); $(this).parent('form').submit(); } });
Less:
.ui-autocomplete{ max-width:400px !important; .ui-state-focus{ background:fade(@color_link,80%) !important; color:@color_white !important; border-color:transparent !important; } } .ui-menu .ui-menu-item.category{ font-weight:bold; color:@color_link; text-decoration:underline; } .ui-autocomplete-group{ padding:3px 1em 3px .4em; font-weight:700; font-size:17px; color:@color_black; margin-top:10px; } .ui-autocomplete-group:first-child{ margin-top:0; }
по теме:
http://jsfiddle.net/bcbond/p924tge8/
mytext.replace(/(<([^>]+)>)/ig,"")
Для использования html в ui autocomplete добавить:
.data("ui-autocomplete")._renderItem=function(ul,item){ return $("<li></li>").data("item.autocomplete",item).append(item.label).appendTo(ul); };
Полный текст:
$("#search").autocomplete({ source:"/ajax_search.php", minLength:3, select:function(event,ui){ $(this).val(ui.item.value.replace(/(<([^>]+)>)/ig,"")); $(this).parent('form').submit(); } }).data("ui-autocomplete")._renderItem=function(ul,item){ return $("<li></li>").data("item.autocomplete",item).append(item.label).appendTo(ul); };
или так, чтобы избавиться от тегов совсем:
$("#search").autocomplete({ source:"/ajax_search.php", minLength:3, select:function(event,ui){ event.preventDefault(); $(this).val(ui.item.value.replace(/(<([^>]+)>)/ig,"")); $(this).parent('form').submit(); } }).data("ui-autocomplete")._renderItem=function(ul,item){ var bold=''; if(item.label.indexOf("<b>")!=-1){ bold=' style="font-weight:bold;"'; } return $("<li"+bold+"></li>").data("item.autocomplete",item).append(item.label.replace(/(<([^>]+)>)/ig,"")).appendTo(ul); };
Вместо:
$("#search").autocomplete({ source:"/ajax_search.php", minLength:3, select:function(event,ui){ $(this).val(ui.item.value); $(this).parent('form').submit(); } });
var radioval=7; $('input[name=radioname]').val([radioval]);
Для вертикальной прокрутки внутри блоков, созданных с использованием fullPage, использовать параметр:
scrollOverflow:true,
Полный пример:
$(document).ready(function(){ $('#fullpage').fullpage({ anchors:['section-0','section-1','section-2'], menu:'#navigation', verticalCentered:false, scrollOverflow:true, afterLoad:function(anchorLink,index){ if(anchorLink=='section-0'){ $('#navigation').hide(); } else{ $('#navigation').show(); } }, }); });
<ul id="navigation"> <li data-menuanchor="section-1"><a href="#section-1">Section 1</a></li> <li data-menuanchor="section-2"><a href="#section-2">Section 2</a></li> </ul> <div id="fullpage"> <div data-anchor="section-0" class="section section-0"></div> <div data-anchor="section-1" class="section section-1"></div> <div data-anchor="section-2" class="section section-2"></div> </div>
.section-0{ background:red; } .section-1{ background:green; } .section-2{ background:blue; } #navigation{ position:fixed; top:100px; left:20px; z-index:100; } #navigation li.active a{ color:red; }
http://alvarotrigo.com/fullPage/
https://github.com/alvarotrigo/fullPage.js
Преобразует 00001 в 1:
$(this).data('card');
Оставит 00001 как есть:
$(this).attr('data-card');