Jquery自动完成国家标志如何?
我需要创建一个自动完成Jquery自动完成国家标志如何?,jquery,jquery-ui-autocomplete,Jquery,Jquery Ui Autocomplete,我需要创建一个自动完成jQuery脚本,该脚本将过滤.csv(或xml等)文件中的信息,选择后,结果将显示所有信息。 据我所知,我将不得不使用jquery自动完成脚本,我整天都在学习,希望找到解决方案。 我有基本的编码知识,我需要它来过滤文本文件中的结果。 文本文件.csv的示例为: "UK", "info1", "info2", "info2", "info3" "ITALY", "info1", "info2", "info2", "info3" "etc", "info1", "info2
jQuery
脚本,该脚本将过滤.csv(或xml等)文件中的信息,选择后,结果将显示所有信息。据我所知,我将不得不使用jquery自动完成脚本,我整天都在学习,希望找到解决方案。
我有基本的编码知识,我需要它来过滤文本文件中的结果。
文本文件.csv的示例为:
"UK", "info1", "info2", "info2", "info3"
"ITALY", "info1", "info2", "info2", "info3"
"etc", "info1", "info2", "info2", "info3"
因此,当用户键入UK时,也将生成标志,单击UK后,将显示info1、2、3我知道我需要这样做,但是如何用我自己的xml、csv等文件替换geo xml?
以及如何加载标志 在这个示例代码中,它将从具有2个值的txt文件中进行过滤。
“12”:“意大利”
如何添加更多内容?示例:
“12”:“125”:“54”:“意大利”
将不起作用如何将标志图像也添加到加载中?
以下是完整的js:
$(function () {
'use strict';
// Load countries then initialize plugin:
$.ajax({
url: 'content/countries.txt',
dataType: 'json'
}).done(function (source) {
var countriesArray = $.map(source, function (value, key) { return { value: value, data: key }; }),
countries = $.map(source, function (value) { return value; });
// Setup jQuery ajax mock:
$.mockjax({
url: '*',
responseTime: 200,
response: function (settings) {
var query = settings.data.query,
queryLowerCase = query.toLowerCase(),
suggestions = $.grep(countries, function(country) {
return country.toLowerCase().indexOf(queryLowerCase) !== -1;
}),
response = {
query: query,
suggestions: suggestions
};
this.responseText = JSON.stringify(response);
}
});
// Initialize ajax autocomplete:
$('#autocomplete-ajax').autocomplete({
serviceUrl: '/autosuggest/service/url',
onSelect: function(suggestion) {
$('#selction-ajax').html('You selected: ' + suggestion.value + ', ' + suggestion.data);
}
});
// Initialize autocomplete with local lookup:
$('#autocomplete').autocomplete({
lookup: countriesArray,
onSelect: function (suggestion) {
$('#selection').html('You selected: ' + suggestion.value + ', ' + suggestion.data);
}
});
// Initialize autocomplete with custom appendTo:
$('#autocomplete-custom-append').autocomplete({
lookup: countriesArray,
appendTo: '#suggestions-container'
});
});
});
下面是html:
<h2>Ajax Lookup</h2>
<p>Type country name in english:</p>
<div>
<input type="text" name="country" id="autocomplete-ajax"/>
</div>
<div id="selction-ajax"></div>
<h2>Local Lookup</h2>
<p>Type country name in english:</p>
<div>
<input type="text" name="country" id="autocomplete"/>
</div>
<div id="selection"></div>
<h2>Custom Lookup Container</h2>
<p>Type country name in english:</p>
<div>
<input type="text" name="country" id="autocomplete-custom-append" style="float: left;"/>
<div id="suggestions-container" style="position: relative; float: left; width: 400px; margin: 10px;"></div>
</div>
</div>
<script type="text/javascript" src="scripts/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="scripts/jquery.mockjax.js"></script>
<script type="text/javascript" src="src/jquery.autocomplete.js"></script>
<script type="text/javascript" src="scripts/demo.js"></script>
Ajax查找
用英语键入国家名称:
本地查找
用英语键入国家名称:
自定义查找容器
用英语键入国家名称:
你能发布你的代码以便我们能帮助你吗?用代码编辑帖子。我不确定这是否有帮助,我已经打开了大约30个选项卡,创建了太多不同的选项,我不知道该怎么做。基本上我需要这样做:嗨,对不起,我没说清楚。我再次编辑后,这是正确的代码,我需要使用,请阅读。谢谢你,有人给我一个qlue吗?我确实粘贴了jquery,我不知道还能做什么。这个脚本应该是好的,我需要的是也添加国旗,使它从一个.txt文件过滤更多的选项。目前只有2个。示例:
“国家”:“选项”
。我真的需要它像:“img旗”、“国家”、“选项”、“选项2”、“选项3+url href”
我只是一个CSS、Html的家伙,请帮忙。