Ajax特效 根据邮政编码获取地区信息 之一
2009-11-12 10:20
537 查看
在很多系统中,需要用户填写个人资料,其中包含地区、城市、邮政编码等信息。而邮政编码本身包含了地区和城市信息,所以可以利用此规则简化操作。用户只需要输入邮政编码,系统根据邮政编码自动取得地区信息。这样做使得用户可以获得更好的使用体验,也可以减少错误的发生。
要实现自动获取地区信息,主要考虑3个问题:邮编正确性保证,触发自动获取的时机,返回信息的格式。
1.利用onkeypress事件进行检查输入的字符
邮编均由数字组成,为了保证用户不输入数字以外的内容,可以利用onkeypress事件进行检查。当用户在邮编文本框中输入字符时,触发该事件。通过在触发函数中调用event.keyCode属性判断按键keyCode的值是否处于48~57之间(对应数字0~9)。如果在范围之外,则说明输入的不是数字,通过设置event.returnValue = false使本次按键事件失效。这样就可以保证用户输入的字符均为数字。
2.用户将焦点移出邮编文本框时自动获取地区信息
当用户将邮编输入完毕后,会将焦点移出邮编所在文本框,此时可通过onblur事件触发getPostalCode函数以获取地区信息。在向服务器发送请求之前,先判断用户输入的邮编是否是6位数字。如果数字位数不正确,则不需要向服务器发出请求。
3.将地区和城市信息作为一个字符串返回给客户端
根据邮政编码的前4位即可判断出地区和城市的信息,所以在服务器端可以先使用全部6位编码进行查找。找到信息后可直接返回,如果没有找到,可取前4位后补“00”继续查找。查找结束后,返回的信息利用“|”作为地区和城市的分隔符,在客户端使用split(“|”)方法再对字符串进行分割即可。如果无法通过邮政编码查找到地区信息,服务器将返回一个空字符串,客户端接收到以后不需要做任何操作,此时用户可以自行输入地区和城市信息。
要实现自动获取地区信息,主要考虑3个问题:邮编正确性保证,触发自动获取的时机,返回信息的格式。
1.利用onkeypress事件进行检查输入的字符
邮编均由数字组成,为了保证用户不输入数字以外的内容,可以利用onkeypress事件进行检查。当用户在邮编文本框中输入字符时,触发该事件。通过在触发函数中调用event.keyCode属性判断按键keyCode的值是否处于48~57之间(对应数字0~9)。如果在范围之外,则说明输入的不是数字,通过设置event.returnValue = false使本次按键事件失效。这样就可以保证用户输入的字符均为数字。
2.用户将焦点移出邮编文本框时自动获取地区信息
当用户将邮编输入完毕后,会将焦点移出邮编所在文本框,此时可通过onblur事件触发getPostalCode函数以获取地区信息。在向服务器发送请求之前,先判断用户输入的邮编是否是6位数字。如果数字位数不正确,则不需要向服务器发出请求。
3.将地区和城市信息作为一个字符串返回给客户端
根据邮政编码的前4位即可判断出地区和城市的信息,所以在服务器端可以先使用全部6位编码进行查找。找到信息后可直接返回,如果没有找到,可取前4位后补“00”继续查找。查找结束后,返回的信息利用“|”作为地区和城市的分隔符,在客户端使用split(“|”)方法再对字符串进行分割即可。如果无法通过邮政编码查找到地区信息,服务器将返回一个空字符串,客户端接收到以后不需要做任何操作,此时用户可以自行输入地区和城市信息。
相关文章推荐
- Ajax特效 根据邮政编码获取地区信息 之二
- Ajax特效 根据邮政编码获取地区信息 之四
- Ajax特效 根据邮政编码获取地区信息 之三
- Ajax-ajax实例2-根据邮政编码获取地区信息
- AJAX实例--根据邮政编号动态获取省,市,县三级地区+仿百度搜索下拉提示
- 根据经纬度获取地区信息
- java根据isbn编码获取书籍信息(附赠http url的util包)
- 根据mac地址+deviceid获取设备唯一编码 获取手机及SIM卡相关信息
- 根据身份证号码来提取人员的信息【身份证号码的前六位所代表的省,市,区, 以及地区编码】的网上地址
- 地理编码反地理编码, 根据地名获取经纬度等信息
- 在.NET中根据SQL Server系统表获取数据库管理信息
- WPF 获取程序路径的一些方法,根据程序路径获取程序集信息
- c++学习之:根据GetLastError()返回值获取错误信息
- 根据角色的选择获取对应信息 选择器事件 on()
- 使用Ajax获取首部信息
- 7.OAut认证 根据授权码获取用户的ID,SECRET等信息
- 利用PHP获取访客IP、地区位置、浏览器及来源页面等信息
- 地区经纬度信息获取(利用Google地图API获取)
- php根据日期或时间戳获取星座信息和生肖等信息
- android--------根据文件路径使用File类获取文件相关信息