我从http://jqueryui.com/autocomplete/
获得了小部件我是这样实现的: 这是我的HTML
<form id="search" class="homepage-search" action="/search/" method="GET">
<legend><label for="tags">search</label></legend>
<input name="sort" value="rel" type="hidden">
<div class="ui-widget">
<!--<input id="query" class="querybox flatinput ui-autocomplete-input" name="query" data-autocomplete="search-count" autocorrect="off" autocapitalize="off" placeholder="search" autofocus autocomplete="off">-->
<input id="query" class="querybox flatinput ui-autocomplete-input tags" name="query" data-autocomplete="search-count" autocorrect="off" autocapitalize="off" placeholder="search" autofocus autocomplete="off">
</div>
这是我从JQueryUI获得的脚本:
<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>
$( function() {
var availableTags = [
"help",
"faq",
"abuse",
"legal",
"avoid scams and fraud",
"personal safety tips",
"terms of use",
"privacy policy",
"system status",
"about Craigslist",
"Craigslist open source",
"Craigslist blog",
"best-of-craigslist",
"craigslist TV",
"activities",
"artists",
"childcare",
"classes",
"events",
"general",
"local news",
"lost+found",
"musicians",
"pets",
"politics",
"rideshare",
"volunteers",
"strictly platonic",
"women seek women",
"women seeking men",
"men seeking women",
"men seeking men",
"misc romance",
"casual encounters",
"missed connections",
"rants and raves",
"apple",
"arts",
"atheist",
"autos",
"beauty",
"bikes",
"celebs",
"comp",
"crafts",
"diet",
"divorce",
"dying",
"eco",
"educ",
"eductation",
"feedbk",
"feed-back",
"feed back",
"film",
"fitness",
"fixit",
"food",
"frugal",
"gaming",
"garden",
"haiku",
"help",
"history",
"housing",
"jobs",
"jokes",
"kink",
"legal",
"linux",
"m4m",
"manners",
"marriage",
"media",
"money",
"motocy",
"music",
"nonprofit",
"non-profit",
"open",
"open relationships",
"outdoor",
"outdoors",
"out-door supplies",
"camping",
"over 50",
"parent",
"pets",
"philos",
"photo",
"p.o.c.",
"psych",
"queer",
"recover",
"religion",
"romance",
"science",
"spirit",
"sports",
"tax",
"taxes",
"travel",
"tc",
"vegan",
"w4w",
"wed",
"wine",
"women",
"words",
"writting",
"yoga",
"apts/housing",
"housing swap",
"housing wanted",
"office / commercial",
"parking / storage",
"local news"
];
$( ".tags" ).autocomplete({
source: availableTags
//minLength:1
});
} );
</script>
我尝试用CSS做这个:
<style>
ui-widget {
display:none;
}
ui-menu-item{
display:none;
}
ui-id-1{
display:none;
}
</style>
那么如何摆脱下拉? *注意:样式标签位于样式表链接之后,小部件位于我的html底部。 我不确定为什么不是自动完成一个单词或短语,而是有一个下拉。我尝试用firebug检查元素,看看如何定位下拉,但显然我没有针对正确的事情。无论是那个还是我都没有超过导致下降的风格。
*编辑 要清楚,我要做的是只在输入框内部进行自动完成工作。那可以吗?
答案 0 :(得分:0)
API documentation有一个解决方案。
使用指定的禁用选项初始化自动完成:
$( ".selector" ).autocomplete({ disabled: true });
初始化后获取或设置禁用选项:
// Getter var disabled = $( ".selector" ).autocomplete( "option", "disabled" ); // Setter $( ".selector" ).autocomplete( "option", "disabled", true );
OR
调用禁用方法:
$( ".selector" ).autocomplete( "disable" );