我正在尝试实现marcopolo,这是一个自动完成的jquery插件。
以下是我的两个问题。
1)如果我输入单个字母或任何单词,将出现“方向”的所有值,这是不正确的。我想,例如,如果我搜索“Up”,那么会出现带有这两个字母的任何单词。
2)如果用户搜索“Up”并按下Enter或点击提交按钮,则应将其转到与该词相关联的URL。
Github参考:https://github.com/jstayton/jquery-marcopolo
Marcopolo示例:http://jstayton.github.io/jquery-marcopolo/example1.html
这是我的代码:http://codepen.io/anon/pen/rrwgwJ
HTML
<input type="text" name="autoCom" id="autoCom"><input type="submit" class="send">
CSS
ol {position: absolute; top: 20px;}
ol.mp_list {list-style-type: none;}
JS
$(function(){
$('#autoCom').marcoPolo({
url: 'https://api.myjson.com/bins/ygdk',
minChars: 1,
submitOnEnter: true,
formatData: function (data) {
return data; //possible issue
},
formatItem: function (data, $item) {
return data.Direction;
},
onSelect: function (data, $item) {
//window.location = data.URL;
this.val(data.Direction);
window.open(data.URL,'_blank');
}
});
});
谢谢你的帮助!
答案 0 :(得分:0)
问题是您发送带有<input/>
元素内容的“q”变量,但您配置为JSON响应的页面没有使用该“q”变量过滤任何内容,因此,您总会得到相同的结果。
[{"Direction":"Up","URL":"http://www.google.com"},{"Direction":"Left","URL":"http://www.cnn.com"},{"Direction":"Right","URL":"http://www.engadget.com"},{"Direction":"Down","URL":"http://www.twitter.com"},{"Direction":"Upward","URL":"http://www.facebook.com"},{"Direction":"Leftwing","URL":"http://www.snapfish.com"},{"Direction":"Rightwing","URL":"http://www.gizmodo.com"},{"Direction":"Downward","URL":"http://www.fox.com"}]