jQuery的autoComplete查看所有点击？
我使用jQuery的自动完成相对简单的方式：
$(document).ready(function() { var data = [ {text: "Choice 1"}, {text: "Choice 2"}, {text: "Choice 3"} ] $("#example").autocomplete(data, { matchContains: true, minChars: 0, formatItem: function(item) { return item.text; } } ); }); 如何添加一个onclick事件（如button或链接），以显示自动填充的所有可用选项？ 基本上我正在寻找一个自动完成和select/下拉元素的混合。
谢谢！
在文档中看不到明显的方法，但是尝试在启用自动填充的文本框上触发焦点（或单击）事件：
$('#myButton').click(function() { $('#autocomplete').trigger("focus"); //or "click", at least one should work });
您可以触发此事件以显示所有选项：
$("#example").autocomplete( "search", "" );
或者看下面的链接中的例子。 看起来正是你想要做的。
http://jqueryui.com/demos/autocomplete/#combobox
编辑 （从@cnanney）
注意：您必须在自动完成中为空searchstring设置minLength：0以返回所有元素。
我发现这个效果最好
var data = [ { label: "Choice 1", value: "choice_1" }, { label: "Choice 2", value: "choice_2" }, { label: "Choice 3", value: "choice_3" } ]; $("#example") .autocomplete({ source: data, minLength: 0 }) .focus(function() { $(this).autocomplete('search', $(this).val()) });
它search标签并将值放入元素$（＃example）
解决scheme： 显示焦点事件的jquery ui自动完成列表
解决scheme使其工作不止一次
<script type="text/javascript"> $(function() { $('#id').autocomplete({ source: ["ActionScript", /* ... */ ], minLength: 0 }).focus(function(){ //Use the below line instead of triggering keydown $(this).data("autocomplete").search($(this).val()); }); });
为了显示所有项目/模拟combobox行为，您应该首先确保您已将minLength选项设置为0（默认值为1）。 然后，您可以绑定click事件以使用空string执行search。
$('inputSelector').autocomplete({ minLength: 0 }); $('inputSelector').click(function() { $(this).autocomplete("search", ""); });
尝试这个：
$('#autocomplete').focus(function(){ $(this).val(''); $(this).keydown(); });
minLength设置为0
每次工作:)
$j(".auto_complete").focus(function() { $j(this).keydown(); })
这是唯一对我有用的东西。 每次显示列表，并在select时closures：
$("#example") .autocomplete(...) .focus(function() { var self = this; window.setTimeout(function() { if (self.value.length == 0) $(self).autocomplete('search', ''); }); })
你可以使用这个：
$("#example").autocomplete( "search", $("#input").val() );
这显示了所有的选项： "%" （见下文）
重要的是，你必须把它放在之前的#example声明之下，就像下面的例子。 这花了我一段时间才弄清楚。
$( "#example" ).autocomplete({ source: "countries.php", minLength: 1, selectFirst: true }); $("#example").autocomplete( "search", "%" );
希望这有助于某人：
$('#id') .autocomplete({ source: hints_array, minLength: 0, //how many chars to start search for position: { my: "left bottom", at: "left top", collision: "flip" } // so that it automatically flips the autocomplete above the input if at the bottom }) .focus(function() { $(this).autocomplete('search', $(this).val()) //auto trigger the search with whatever's in the box })
<input type="text" name="q" id="q" placeholder="Selecciona..."/> <script type="text/javascript"> //Mostrar el autocompletado con el evento focus //Duda o comentario: http://WilzonMB.com $(function () { var availableTags = [ "MongoDB", "ExpressJS", "Angular", "NodeJS", "JavaScript", "jQuery", "jQuery UI", "PHP", "Zend Framework", "JSON", "MySQL", "PostgreSQL", "SQL Server", "Oracle", "Informix", "Java", "Visual basic", "Yii", "Technology", "WilzonMB.com" ]; $("#q").autocomplete({ source: availableTags, minLength: 0 }).focus(function(){ $(this).autocomplete('search', $(this).val()) }); }); </script>
您必须将minLenght设置为零才能使其工作！ 这是一个工作的例子。
$( "#dropdownlist" ).autocomplete({ source: availableTags, minLength: 0 }).focus(function() { $(this).autocomplete('search', $(this).val()) }); });
我解决了这个属性minChars：0和之后，触发两个点击。 （自动完成后显示1点击input）我的代码
<input type='text' onfocus='setAutocomplete(this)'> function setAutocomplete(el){ $(el).unbind().autocomplete("./index.php", {autoFill:false, minChars:0, matchContains:true, max:20}); $(el).trigger("click");$(el).trigger("click"); }
我已经看到了所有似乎完整的答案。
如果您想要在光标位于文本字段中时获取列表，或者当您单击匹配的标签时，在此处如何操作：
//YourDataArray = ["foo","bar"]; $( "#YourID" ).autocomplete({ source: YourDataArray }).click(function() { $(this).autocomplete("search", " "); });
这在Firefox，IE浏览器，铬…
$("#searchPkgKeyWord").autocomplete("searchURL", { width: 298, max: 1000, selectFirst: false }).result(function (event, row, formatted) { callback(row[1]); }).focus(function(){ $(this).click(); //once the input focus, all the research will show });
我无法得到$("#example").autocomplete( "search", "" ); 部分工作，只有一次，我改变了我的search与我的来源存在的字符它的工作。 所以我使用例如$("#example").autocomplete( "search", "a" ); 。
我猜更好的select是把$（“＃idname”）。autocomplete（“search”，“”）; 进入文本框的onclick参数。 由于select，重点放在由jquery，这可以是一个解决方法。 不知道是否应该是一个可以接受的解决scheme。
我最近需要这样做，并尝试了几个不同的排列（使用onfocus，onclick文本框等）后，我终于在这个…
<input id="autocomplete" name="autocomplete" type="text" value="Choose Document"> <p> <button type="submit" value="Submit" name="submit" id="submit" > Submit </button> </p> <script type="text/javascript"> $("#autocomplete").autocomplete( { source: '@Url.Content("~/Document/DocumentTypeAutoComplete/")' //<--ddl source , minLength: 0 // <-- This is necessary to get the search going on blank input , delay: 0 , select: function (event, ui) { if (ui.item) { $("#autocomplete").val(ui.item.value);//<-- Place selection in the textbox $("docForm").submit(); loadDocTypeCreatePartial(ui.item); $("#submit").focus(); //This stops the drop down list from reopening // after an item in the select box is chosen // You can place the focus anywhere you'd like, // I just chose my *submit* button } } }).focus(function () { // following line will autoselect textbox text // making it easier for the user to overwrite whats in the // textbox $(this).select(); //The below line triggers the search function on an empty string $(this).data("autocomplete").search(''); }); </script>
这将打开焦点上的自动完成ddl列表（即使您的input框中有默认文本，就像我上面所做的那样）。
它还自动select文本框中的文本，以防止用户不得不清除文本。
从自动完成列表中select一个项目后，将该项目放入自动完成input框，并将焦点移至另一个控件（从而防止重新开始自动完成）。
我计划通过添加dynamicAjax调用来替代它，当我有机会的时候，通过融化冰升级来select非常漂亮的select列表。
我用这种方式：
$("#autocomplete").autocomplete({ source: YourDataArray, minLength: 0, delay: 0 });
然后
OnClientClick="Suggest(this); return false;"/> function Suggest(control) { var acControl = $("#" + control.id).siblings(".ui-autocomplete-input"); var val = acControl.val(); acControl.focus(); acControl.autocomplete("search");
