javascript - "Uncaught Error: Syntax error, unrecognized expression:"具有自动完成功能(特殊字符?)

标签 javascript jquery autocomplete

jQuery 1.10.2 和 jQuery ui 核心 v1.11.4

当我使用自动完成搜索术语时出现以下错误:

Uncaught Error: Syntax error, unrecognized expression: Lewis, George E.

Uncaught Error: Syntax error, unrecognized expression: What?

当我用鼠标在结果上导航时,我也遇到了很多这样的情况:

Uncaught TypeError: Cannot read property 'value' of undefined

这是代码:

function agostoAutocomplete(self){

// Recuperation de la page de recherche
var searchUrl = $(self).attr("data-search");
console.log(searchUrl);

//Création d'une fonction pour les catégories
$.widget("custom.catcomplete", $.ui.autocomplete, {
   _renderMenu: function(ul, items) {
       var that = this,
                  currentCategory = "";
       //Verifie si il y a une categorie
       $.each(items, function(index, item) {
            if(item.category){
                if (item.category != currentCategory) {
                   ul.append("<li class='ui-autocomplete-category MEDIA"+item.idrub+"'><h4>"+item.category+"</h4></li>");
                   currentCategory = item.category;
                   //alert(item.category);
               }
               that._renderItemData(ul, item);
            } else {
               that._renderItemData(ul, item);
               //alert('no category works!');
            }
        });
    }
});
//Lancement de la function créée
$(self).catcomplete({
    delay: 100,
    minLength: 1,
    source: searchUrl,
    autoFocus: true,
    response : function(event, ui) {
        // Test si resultat ou pas
        if (ui.content.length === 0) {
             var noResult = { 
             value: "", 
             label: "No results found" 
             };
             ui.content.push(noResult); 
        } else {
        }
    },
    }).data("custom-catcomplete")._renderItem = function( ul, item ) {
        var noresult = $(item.label);
        console.log("label: "+item.label);
        console.log("category:"+item.category);
        console.log("idobject: "+item.idobject);
        console.log("idRub: "+item.idrub);
        console.log("reference: "+item.reference);
        console.log("value: "+item.value);
        console.log("CompositionObject: "+item.compositionobject);
        //var t = item.label.replace('.',"//.");
        if (item.label == 'No results found'){
            return $("<li class='ui-menu-item ui-no-result'><h4>"+item.label+"</h4></li>").appendTo(ul);
        } else {
            if (item.icon){
                return $("<li></li>").data("ui-autocomplete-item", item)
                .append(
                    $("<a class='ui-menu-item autoAjax' data-id-object="+item.id+" data-id-rubrique="+item.idrub+" data-composition-object="+item.compositionobject+"></a>")
                    .append($("<img></img>").attr('src', item.icon))
                    .append( $("<h5>"+item.label+"</h5>")))
                    .appendTo(ul);
            } else {
                return $("<li></li>").data("ui-autocomplete-item", item)
                .append(
                    $("<a class='ui-menu-item autoAjax' data-id-object="+item.id+" data-id-rubrique="+item.idrub+" data-composition-object="+item.compositionobject+"></a>")
                    .append($("<img></img>").attr('src', "/plugins/spipr_agosto/img/nologo.png"))
                    .append($("<h5>"+item.label+"</h5>")))
                    .appendTo(ul);
            }
        }
};

}

对于其他结果,其工作原理如下:

jose, garcia

robert, fatice

我花了几个小时试图找到它,但仍然没有机会..有人知道我错在哪里吗?

这里是片段:

// Initialisation de Autocomplete
function agostoAutocomplete(self){

	// Recuperation de la page de recherche
	
	//Création d'une fonction pour les catégories
	$.widget("custom.catcomplete", $.ui.autocomplete, {
       _renderMenu: function(ul, items) {
           var that = this,
           			  currentCategory = "";
           //Verifie si il y a une categorie
           $.each(items, function(index, item) {
           		if(item.category){
           			if (item.category != currentCategory) {
	                   ul.append("<li class='ui-autocomplete-category MEDIA"+item.idrub+"'><h4>"+item.category+"</h4></li>");
	                   currentCategory = item.category;
	                   //alert(item.category);
	               }
	               that._renderItemData(ul, item);
           		} else {
	               that._renderItemData(ul, item);
	               //alert('no category works!');
	            }
          	});
        }
	});
	//Lancement de la function créée
   var availableTags = [
      { label: "What?", category: "test1" },
      { label: "Lewis, George E.", category: "test2" },
      { label: "antal", category: "" },
      { label: "annhhx10", category: "Products" },
      { label: "annk K12", category: "Products" },
      { label: "annttop C13", category: "Products" },
      { label: "anders andersson", category: "People" },
      { label: "andreas andersson", category: "People" },
      { label: "andreas johnson", category: "People" }
    ];
	$(self).catcomplete({
    	delay: 100,
    	minLength: 1,
    	source: availableTags,
    	autoFocus: true,
        response : function(event, ui) {
            // Test si resultat ou pas
            if (ui.content.length === 0) {
                 var noResult = { 
	             value: "", 
	             label: "No results found" 
		         };
		         ui.content.push(noResult); 
            } else {
            }
        },
		}).data("custom-catcomplete")._renderItem = function( ul, item ) {
			var noresult = $(item.label);
			console.log("label: "+item.label);
			console.log("category:"+item.category);
			console.log("idobject: "+item.idobject);
			console.log("idRub: "+item.idrub);
			console.log("reference: "+item.reference);
			console.log("value: "+item.value);
			console.log("CompositionObject: "+item.compositionobject);
         	//var t = item.label.replace('.',"//.");
			if (item.label == 'No results found'){
				return $("<li class='ui-menu-item ui-no-result'><h4>"+item.label+"</h4></li>").appendTo(ul);
			} else {
			 	if (item.icon){
					return $("<li></li>").data("ui-autocomplete-item", item)
					.append(
						$("<a class='ui-menu-item autoAjax' data-id-object="+item.id+" data-id-rubrique="+item.idrub+" data-composition-object="+item.compositionobject+"></a>")
						.append($("<img></img>").attr('src', item.icon))
						.append( $("<h5>"+item.label+"</h5>")))
						.appendTo(ul);
				} else {
					return $("<li></li>").data("ui-autocomplete-item", item)
					.append(
						$("<a class='ui-menu-item autoAjax' data-id-object="+item.id+" data-id-rubrique="+item.idrub+" data-composition-object="+item.compositionobject+"></a>")
						.append($("<img></img>").attr('src', "/plugins/spipr_agosto/img/nologo.png"))
						.append($("<h5>"+item.label+"</h5>")))
						.appendTo(ul);
				}
			}
	};
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
 <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<input type="search" data-search="spip.php?page=autocomplete_center" placeholder="Type an artist name" id="recherche_media_resource" class="recherche" onfocus="agostoAutocomplete(this);" >

非常感谢!

最佳答案

删除这一行:

var noresult = $(item.label);

我不确定它有什么用处,但它会强制出现错误,因为 item.label 将在此处用作选择器,但例如Lewis、George E.What? 不是有效的选择器

关于javascript - "Uncaught Error: Syntax error, unrecognized expression:"具有自动完成功能(特殊字符?),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31223659/

相关文章:

javascript - 如果包含三个版本的 jquery 并在中间包含一个使用 jquery $ 对象的脚本,会发生什么情况

javascript - 如何在 Material UI 中删除自动完成之外的选定芯片

javascript - jQuery 自动完成不起作用(JSON PHP 到 js)

javascript - 使用 jquery 将 javascript 变量发送到提交时的 Rails 变量

jquery - 使用 AngularJS 和 JQuery 的用例

javascript - 使用 javascript/jquery 将 CSV 拆分为对象

jquery - 为什么 jquery ui 自动完成功能放弃对这些功能的支持?

javascript - mobx 中的@observable 和@observable.ref 修饰符有什么区别?

javascript - 使用 d3.layout.stack() 从图层访问自定义坐标

javascript - 在同一 React 组件的不同实例之间切换时使用 componentDidMount