【发布时间】:2015-08-12 20:52:23
【问题描述】:
所以我正在尝试在 jquery 中重新创建 Facebooks 标记系统。我不能使用任何插件。我已经有了一些:
<html lang="de">
<head>
<title>Autocomplete</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var triggered = false;
var trigger = "@";
var index = -1;
$("input").autocomplete({
source: [
"AAB",
"AAC",
"CCE",
"CCG",
"IIU",
"IIO"],
search: function () {
if (!triggered) {
return false;
}
},
select: function (event, ui) {
var text = this.value;
var pos = text.lastIndexOf(trigger);
this.value = text.substring(0, pos + trigger.length) + ui.item.value;
triggered = false;
return false;
},
focus: function () {
return false;
},
minLength: 0
}).on("keyup", function () {
var text = this.value;
var len = text.length;
var last;
var query;
if (triggered) {
index = text.lastIndexOf(trigger);
query = text.substring(index + trigger.length);
$(this).autocomplete("search", query);
if (index === -1) {
triggered = false;
}
} else if (len >= trigger.length) {
console.log("ELSE IF")
last = text.substring(len - trigger.length);
triggered = (last === trigger);
}
});
});
</script>
</head>
<body>
<label>Input something here:</label>
<br>
<input type="text" value="" autofocus="true" />
</body>
</html>
所以我遇到了以下问题:标记工作正常,但在我点击 @ 后,一旦自动完成不会消失。它停止搜索,但仍显示未找到结果。我尝试如下解决:
- 我尝试了自动完成中的“禁用”属性,导致它根本无法工作。
- 我尝试了“destroy”方法,但导致我第一次后无法调用自动完成
- 我尝试了导致显示“有 6 个元素”(我在此解释)的“禁用”方法
- 最后我尝试了 close 方法,它完全没有任何作用。
所以我的问题:有没有人知道这如何工作的诀窍?我必须以某种方式重写我的代码吗?
【问题讨论】:
-
你能分享一个小提琴吗?
-
@bloC 这是小提琴:jsfiddle.net/j1cLecwz/3
-
你可以试试`$('#tags').autocomplete('close');`来关闭自动完成窗口。
-
@dreamweiver 正如我在最后一点中所说,这绝对没有任何作用,无论如何,谢谢
标签: javascript jquery facebook jquery-ui autocomplete