对城市名搜索（汉字、拼音）功能的改进 / 小程序城市区县定位模块改进

最新推荐文章于 2019-08-30 17:08:03 发布
最新推荐文章于 2019-08-30 17:08:03 发布
阅读量1.5k 收藏
点赞数
分类专栏： 微信小程序 javascript 文章标签： javascript json 定位模块 城市选择 小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/beijiyang999/article/details/77985416
版权
本文介绍了一位开发者如何改进微信小程序的城市/区县定位选择模块，使其支持汉字和拼音搜索。通过增加拼音属性以完善数据，解决部分地级市搜索不到的问题。在处理地名格式差异和重复匹配的现象后，实现了更流畅的用户体验。
摘要由CSDN通过智能技术生成

效果演示

在真机预览的画面是非常流畅的

gif

###支持搜索335个城市(及相应级别地区)。截至目前，最新的国家统计局2016年统计年鉴中,地级市291个，地级行政区划334个。

项目仓库

微信小程序 城市/区县定位选择模块 汉字/拼音搜索 可直接使用

更新 注：项目代码已重构。如有帮助请 start。

改进的问题

小程序项目中需要城市区县定位功能，就自己写了个小程序城市/区县定位选择模块，支持汉字、拼音搜索，之前一篇文章介绍了城市名搜索功能的实现。

后发现有的地级市搜不到，必须从侧边栏搜索首字母，再点

最低0.47元/天 解锁文章
Beijiyang999
关注
专栏目录
城市列表-城市汉字搜索和拼音搜索
03-24
Android 城市列表，具有搜索功能---城市汉字搜索和拼音搜索，看了网上的都没得搜索功能，所以完善了下！
微信小程序 实现城市名称拼音搜索框 汉字/拼音（城市区县定位模块）
Beijiyang
06-12 9455
要实现的效果展示如下 总体思路： 首先，数据中，城市对象里，包含其全拼、简拼的属性； 然后，逻辑层，找出 能与 输入框输入的字符串 相匹配的 对象； 最后，展示层，把所有匹配的城市名都渲染出来。 接下来，我们按步骤来一窥究竟。首先，是数据为了举例方便，test.js 中，我们使用简化版的数据：'use strict’ const cityList = [{ "id": "35", "provinc
根据城市名称检索城市ID，以及省市县（LitePal+RxJava+Retrofit）
qq_37810152的博客
08-12 4944
今天我们要做的是这样一个效果，大家都知道天气预报软件中，必须要一个城市的名称，然后用户根据自己输入的城市，然后弹出检索出来的内容，这样就可以确定是哪个城市。废话不多说，先看下实现的效果，在决定是不是你想要的代码案例。  如果你不想浏览下面的内容，只想要实现的代码，那么就点击这里吧：  https://github.com/immppp/RxJavaForDemo。  好了，效果就像上图所展...
微信小程序全国城市搜索（可进行城市中文拼音首字母搜索）
liushuanglian的博客
08-30 5220
废话不多说直接上代码 wxml <!--pages/setUpArea/setUpArea.wxml--> <view class="content"> <view class="search"> <input placeholder="请输入城市中文名或拼音" placeholder-class="center" bindinput="bin...
城市列表-根据拼音首字母排序
热门推荐
Mannver的博客
05-04 1万+
今天我们就简单的实现一下城市的排序 读取我们城市的信息并通过listview展示 首先看一下我们的布局文件<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_w
小程序实现城市选择
GUK
07-17 2016
&lt;view class="search-box"&gt; &lt;input placeholder="中文/拼音/首字母" class='search-input' bindinput='bindSarchInput' placeholder-class='search-input-placeholder' /&gt; &lt;/view&gt; &lt;view class='a-...
微信小程序-微信小程序 城市区县定位选择器 带拼音搜索 可直接使用
08-06
微信小程序 城市/区县定位选择器 主要功能 自动定位 城市、区县（也支持手动） 输入框内，通过 拼音搜索 城市，支持全拼、简拼 亦可通过 侧边栏 选择，城市按拼音首字母排列 选择好城市后，自动显示辖下 区县 说明...
citySelector：基于mpvue的微信小程序城市区县定位选择模块汉字拼音搜索可直接使用已更新
02-05
微信小程序城市/区县定位选择器（mpvue版本） 一款开箱即用的小程序城市/区县选择器 前两天在实现一个城市选择器的需求的时候，在github上了同学的开源项目，觉得做的非常不错，不过是基于原生小程序写的，所以就花...
微信小程序获取当前位置和城市名
10-15
在微信小程序开发中，获取用户当前位置和城市名是常见的需求，尤其对于提供本地化服务的应用来说至关重要。本文将详细介绍如何实现这一功能。 首先，要获取用户的地理位置，必须先获得用户的授权。微信小程序提供了...
微信小程序市区县定位选择模块汉字拼音搜索
08-11
总的来说，"微信小程序市区县定位选择模块汉字拼音搜索"涉及的技术点包括：微信小程序API的使用、地图API的集成、汉字到拼音的转换、模糊搜索算法的实现、用户界面的交互设计以及性能优化策略。通过熟练掌握这些技术...
全国省市区县编码、经纬度、拼音
07-04
全国各省市行政区划编码、经纬度信息、拼音等，SQL文件。 INSERT INTO `s_provinces` VALUES ('100000', '中国', '0', '中国', '0', '', '', '中国', '116.3683244', '39.915085', 'China', '1'); INSERT INTO `s_provinces` VALUES ('110000', '北京', '100000', '北京', '1', '', '', '中国,北京', '116.405285', '39.904989', 'Beijing', '1'); INSERT INTO `s_provinces` VALUES ('110100', '北京市', '110000', '北京', '2', '010', '100000', '中国,北京,北京市', '116.405285', '39.904989', 'Beijing', '1'); INSERT INTO `s_provinces` VALUES ('110101', '东城区', '110100', '东城', '3', '010', '100010', '中国,北京,北京市,东城区', '116.41005', '39.93157', 'Dongcheng', '1'); INSERT INTO `s_provinces` VALUES ('110102', '西城区', '110100', '西城', '3', '010', '100032', '中国,北京,北京市,西城区', '116.36003', '39.9305', 'Xicheng', '1'); INSERT INTO `s_provinces` VALUES ('110105', '朝阳区', '110100', '朝阳', '3', '010', '100020', '中国,北京,北京市,朝阳区', '116.48548', '39.9484', 'Chaoyang', '1'); INSERT INTO `s_provinces` VALUES ('110106', '丰台区', '110100', '丰台', '3', '010', '100071', '中国,北京,北京市,丰台区', '116.28625', '39.8585', 'Fengtai', '1');
Android选择城市Demo，可根据拼音、首字母搜索
10-09
博客地址：http://blog.csdn.net/u013700040/article/details/78180096 Android选择城市界面，可以根据城市拼音、首字母搜索
jquery.autocomplete 用户输入城市名、或拼音即可有匹配的提示
01-05
项目中有一个城市导航，导航上有一个城市搜索，即用户输入城市名、或拼音即可有匹配的提示，方便用户选择。于是乎下载了一个jquery.autocomplete-1.1.3，但引用到项目后，发现几个问题，并相应做了修改： 1.中文输入后，服务端不能正常获取ajax提交的数据（此处，当然可以用相应转码，本人试了n种方便仍改），细看代码发现， 是用 $.get(this.serviceUrl, me.options.params, function(txt) { me.processResponse(txt); }, 'text'); 提交的， 于是改成了我熟悉的提交方式。 $.ajax({url:this.serviceUrl,data:"query="+me.options.params.query,timeout: 5000,success: function(o){me.processResponse(o);}}); 问题立即解决。 猜想，是默认utf-8编码与我服务端过滤器中转码以及代码的转码发生了冲突。 2.当输入框值发生变化时，onchange事件不灵敏。 于是，添加了一个函数，输入值一但onchange就调用 。 onKeyProcessDefult: function(i) { var me, fn, s, d; me = this; s = me.suggestions[i]; d = me.data[i]; if(this.currentValue!=s || undefined==d){d="";s="";} this.selectedIndex=0; //输入时，一但有匹配的项，就默认选择第一项,这样，再按回车键，即可直接submit提交 jht添加 2011-07-20 $(".auto_selected_val").val(d); } 3. 当输入正确值，而不去选择相应提示项时，按回车键，不能完成自动提交。另外就是，当输入正确值，而不去选择相应提示项进，点击后面的提交按钮，也不能完成提交。（赶集网的城市切换也有这个小瑕疵哦）。 于是修改为，一但输入后只有可匹配的项时，就默认选中第一项（代码如上）。 这样，再提交就不是问题了。 4.输入值，当没有相应匹配项时，没有任何提示，不友好，影响用户体验。 5.服务服端注意返回json格式参数格试哦{ query:'c',suggestions:['北京','保定','包头','本溪'],data:['hr','cu','cy','cz'] } 项目应用实例：http://www.juyuan.com/members/city 参考实案例：http://www.ganji.com/index.htm
全国城市名称数据库
04-21
按照拼音首字母进行排序的城市名
04-05
所有城市名按照拼音首字母进行了整理，花了一个多小时打完的，因为找不到有人整理，所以我就整理了，打完了手都疼，方便你们做城市列表的时候直接取
微信小程序实现城市列表选择
08-27
本文将深入探讨如何在小程序中构建这样的功能，包括实现中文、拼音和首字母搜索，以及首字字母快速定位。 首先，我们要创建一个包含所有城市的数据库或API接口。这个数据源通常是一个JSON对象，包含了各个城市的...
查询城市（可根据汉字、拼音和首字母查询）
12-24 1978
可查询中国所有城市信息，并且支持全称、拼音及首字母模糊查询
腾讯地图根据城市 地名 检索信息
qq_25533907的博客
08-04 4011
var lat, lng;     var city = "";    var geolocation = new qq.maps.Geolocation("OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77", "myapp");     var options = { timeout: 8000 };     //腾讯地图获取当前定位城市、经纬度    
城市按拼音首字母排列列表Demo
09-09
城市按拼音首字母排列列表Demo
uniapp小程序选择城市区县的插件
最新发布
06-01
Uniapp小程序可以使用第三方的城市选择插件，比如uni-picker-city插件。您可以在官方插件市场（https://ext.dcloud.net.cn/）搜索该插件并安装使用。 该插件支持全国范围内的城市选择，包括省份、城市和区县，具有...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值