Javascript 如何在Jquery自动完成对话框中进行选择？
我试图在Jquery自动完成对话框中创建一个选择字段。当此html元素可见时，对话框会阻止用户单击它。关于如何覆盖单个元素的默认行为，有什么提示吗 或者，是否可以让菜单小部件这样的东西在自动完成字段中工作，这样我就可以进行多层选择 这是我尝试做的代码剪贴画：Javascript 如何在Jquery自动完成对话框中进行选择？,javascript,jquery,autocomplete,Javascript,Jquery,Autocomplete,我试图在Jquery自动完成对话框中创建一个选择字段。当此html元素可见时，对话框会阻止用户单击它。关于如何覆盖单个元素的默认行为，有什么提示吗 或者，是否可以让菜单小部件这样的东西在自动完成字段中工作，这样我就可以进行多层选择 这是我尝试做的代码剪贴画： <html> <head> <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.cs
<html>
<head>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="https://resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$.widget( "custom.catcomplete", $.ui.autocomplete, {
_create: function() {
this._super();
this.widget().menu( "option", "items", "> :not(.ui-autocomplete-category)" );
},
_renderItem: function( ul, item ) {
return $( "<li></li>" )
.data( "item.autocomplete", item )
.append( "<a>" + item.label +"</a>" )
.appendTo( ul );
},
_renderMenu: function( ul, items ) {
var that = this,
currentCategory = "";
ul.prepend('Please Select <select name="number" id="number"> <option>1</option> <option selected="selected">2</option> <option>3</option> </select>');
$.each( items, function( index, item ) {
var li;
if ( item.category != currentCategory ) {
ul.append( "<br><li class='ui-autocomplete-category'><b>" + item.category + "</b></li>" );
currentCategory = item.category;
}
li = that._renderItemData( ul, item );
if ( item.category ) {
li.attr( "aria-label", item.category + " : " + item.label );
}
});
}
});
$( function()
{ var availableTags = [{label:"Apple",category:"Red"},{label:"Strawberry",category:"Red"},{label:"Coconut",category:"Brown"},];
$( "#tags" ).catcomplete(
{ source: availableTags
});
});
</script>
</head>
<body>
<div class="ui-widget">
Fruits: <input id="tags">
</div>
</body>
</html>
$.widget（“custom.catcomplete”，$.ui.autocomplete{
_创建：函数（）{
这个；
this.widget（）菜单（“选项”，“项目”，“>：非（.ui自动完成类别）”）；
},
_renderItem：功能（ul，项目）{
返回$（“”）
.data（“item.autocomplete”，item）
.append（“+item.label+”）
.附录（ul）；
},
_renderMenu：功能（ul，项目）{
var=这个，
currentCategory=“”；
ul.prepend（'请选择1 2 3'）；
$。每个（项目、功能（索引、项目）{
李华；
如果（item.category！=当前类别）{
ul.追加（“
”+item.category+“ ”）；
currentCategory=item.category；
}
li=该值。_renderItemData（ul，项目）；
if（item.category）{
li.attr（“aria标签”，item.category+”：“+item.label）；
}
});
}
});
$（函数（）
{var availableTags=[{标签：“苹果”，类别：“红色”}，{标签：“草莓”，类别：“红色”}，{标签：“椰子”，类别：“棕色”}，]；
$（“#标记”）.catcomplete(
{来源：availableTags
});
});
水果：