前言

要說(shuō)阿落在開發(fā)電商項(xiàng)目時(shí)，遇到頭疼的問題之一，那就是根據(jù)地址信息獲取經(jīng)緯度。

在獲取經(jīng)緯度時(shí)，在項(xiàng)目中一般有兩種處理方式。

一種是根據(jù)用戶填寫的詳細(xì)地址，去調(diào)用高德地圖的API獲取經(jīng)緯度，這種一般作用于用戶收貨地址，然后用收貨地址來(lái)獲取經(jīng)緯度，用來(lái)匹配最近的倉(cāng)庫(kù)；

一種是在后臺(tái)提供選擇地址的功能，通過(guò)輸入的地址或選取的地圖的點(diǎn)獲取經(jīng)緯度，這種一般作用于倉(cāng)庫(kù)定位、線下商家定位等；

這篇文章，阿落要說(shuō)的就是第二種，在頁(yè)面中提供搜索地址或地圖選點(diǎn)的方式獲取經(jīng)緯度。

1.實(shí)現(xiàn)目標(biāo)

(1)輸入地址，獲取詳細(xì)地址與經(jīng)緯度

當(dāng)在后臺(tái)編輯時(shí)，在文本框輸入完地址后，選擇目標(biāo)地址或需要的地址，自動(dòng)獲取該地址在地圖中的詳細(xì)地址字符串，以及該地址對(duì)應(yīng)的經(jīng)緯度；

圖片1

(2)輸入地址時(shí)對(duì)地址聯(lián)想

一個(gè)地址名詞，可能會(huì)有多處地方，當(dāng)想不起來(lái)是在哪個(gè)區(qū)域時(shí)，就需要地圖來(lái)幫助我們智能聯(lián)想了。所以，當(dāng)我們?cè)谖谋究蜉斎氲刂泛螅詣?dòng)聯(lián)想該地址關(guān)聯(lián)的地址列表，供我們參考或選擇。

圖片2

2.代碼實(shí)現(xiàn)

備注：前端框架使用的為L(zhǎng)ayUI

（1）Html代碼

    
        
            
                
                    RW。
                        保存                    
                
            
            RW。
                  詳細(xì)地址                                
                                                                            
            
                        
                * 省市區(qū)                
                                            請(qǐng)選擇                                                            
                
                                                                                
                
                                                                                
            
            RW。
                * 輸入地址                
                                                                                
                
            
        
    

（2）JavaScript代碼

4.結(jié)語(yǔ)

本篇內(nèi)容就到這里了，對(duì)于獲取經(jīng)緯度，大家還有什么更好的建議或方式嗎。