В случае, когда возникает ошибка Uncaught TypeError: a.indexOf is not a function
при использовании последних версий Jquery, например в этом случае:
$(window).load(function(){
});
использовать:
$(window).on('load',function(){
});
Для имитации клика по якорю:
$('.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/
Для использования 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();
}
});