jQuery UI自动完成：只允许从build议列表中select的值
我正在实现jQuery UI自动完成，并且想知道是否有任何方法只允许从返回的build议结果中进行select，而不是允许将任何值input到文本框中。
我使用这个标签系统非常像这个网站上使用的标签系统，所以我只想让用户从预填充列表中select标签返回到自动完成插件。
我遇到了同样的问题，没有被定义。 得到了解决办法，并添加了toLowerCase函数，只是为了安全起见。
$('#' + specificInput).autocomplete({ create: function () { $(this).data('ui-autocomplete')._renderItem = function (ul, item) { $(ul).addClass('for_' + specificInput); //usefull for multiple autocomplete fields return $('<li data-id = "' + item.id + '">' + item.value + '</li>').appendTo(ul); }; }, change: function( event, ui ){ var selfInput = $(this); //stores the input field if ( !ui.item ) { var writtenItem = new RegExp("^" + $.ui.autocomplete.escapeRegex($(this).val().toLowerCase()) + "$", "i"), valid = false; $('ul.for_' + specificInput).children("li").each(function() { if($(this).text().toLowerCase().match(writtenItem)) { this.selected = valid = true; selfInput.val($(this).text()); // shows the item's name from the autocomplete selfInput.next('span').text('(Existing)'); selfInput.data('id', $(this).data('id')); return false; } }); if (!valid) { selfInput.next('span').text('(New)'); selfInput.data('id', -1); } } }
你也可以使用这个：
change: function(event,ui){ $(this).val((ui.item ? ui.item.id : "")); }
我所看到的唯一缺点是，即使用户input了可接受项目的全部值，当他们从文本字段移动焦点时，它将删除该值，并且他们将不得不再次执行。 他们能够input一个值的唯一方法是从列表中select它。
不知道这对你是否重要。
我只是修改代码在我的情况下，它的工作
selectFirst: true, change: function (event, ui) { if (ui.item == null){ //here is null if entered value is not match in suggestion list $(this).val((ui.item ? ui.item.id : "")); } }
你可以试试
http://jsfiddle.net/pxfunc/j3AN7/
var validOptions = ["Bold", "Normal", "Default", "100", "200"] previousValue = ""; $('#ac').autocomplete({ autoFocus: true, source: validOptions }).keyup(function() { var isValid = false; for (i in validOptions) { if (validOptions[i].toLowerCase().match(this.value.toLowerCase())) { isValid = true; } } if (!isValid) { this.value = previousValue } else { previousValue = this.value; } });
我是这样解决清单的：
$("#settlement").autocomplete({ source:settlements, change: function( event, ui ) { val = $(this).val(); exists = $.inArray(val,settlements); if (exists<0) { $(this).val(""); return false; } } });
我在drupal 7.38上，只允许从自动完成中的select框input，你只需要删除用户input点，在那里js不再需要它 – 这种情况下，只要search – 结果到达build议 – popup右键那里你可以保存设置：
**this.input.value = ''**
在autocomplete.js的摘录中看到下面的内容…所以我将整个Drupal.jsAC.prototype.found对象复制到我的自定义模块中，并将其添加到所需的表单
$form['#attached']['js'][] = array( 'type' => 'file', 'data' => 'sites/all/modules/<modulname>_autocomplete.js', );
这里是从单行修改的drupal原始misc / autocomplete.js的摘录…
Drupal.jsAC.prototype.found = function (matches) { // If no value in the textfield, do not show the popup. if (!this.input.value.length) { return false; } // === just added one single line below === this.input.value = ''; // Prepare matches.
=切断。 。 。 。 。 。
用简单的jQuery，使用事件focusout ：
例如：
$("#input").focusout(function(){ });
然后：用$( "#input" ).val()获取文本，并检查该单词是否与数组一致。 如果不清除input： $( "#input" ).val('');
