現(xiàn)在很多的app,尤其是電商類的app在添加地址功能里面一般都會使用地址的三級聯(lián)動,那么它是怎么實(shí)現(xiàn)的呢?其實(shí)很簡單,現(xiàn)在簡單的介紹一下使用第三方的依賴來實(shí)現(xiàn)三級聯(lián)動的效果.
梅州ssl適用于網(wǎng)站、小程序/APP、API接口等需要進(jìn)行數(shù)據(jù)傳輸應(yīng)用場景，ssl證書未來市場廣闊！成為成都創(chuàng)新互聯(lián)的ssl證書銷售渠道，可以享受市場價(jià)格4-6折優(yōu)惠！如果有意向歡迎電話聯(lián)系或者加微信：13518219792（備注：SSL證書合作）期待與您的合作！
1.開始編寫
1).在module的build.gradle文件中的dependencies節(jié)點(diǎn)里面添加這樣一行代碼引入依賴
[html] view plain copy
compile 'com.bigkoo:pickerview:2.0.8'
2).項(xiàng)目的目錄結(jié)構(gòu)
包括assets資產(chǎn)目錄,三個類文件,分別是activity的代碼邏輯類,省份的實(shí)體類以及獲取省份信息json字符串的工具類.
3)實(shí)體類編寫如下:
[java] view plain copy
public class AddressBean {
public String name;
public AddressBean(String name) {
this.name = name;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getPickerViewText() {
//這里是固定寫法,依賴庫會根據(jù)集合內(nèi)容使用反射顯示文本到省份欄的文本框中
return this.name;
}
@Override
public String toString() {
return "AddressBean{" +
"name='" + name + '\'' +
'}';
}
}
4).獲取json字符串的工具類代碼
[html] view plain copy
/**
* Created by yangtao on 2016/12/11.
* 從資產(chǎn)目錄中獲取json字符串
*/
public class JsonUtils {
public static String getJsonString(Context context,String name){
ByteArrayOutputStream baos = new ByteArrayOutputStream();
AssetManager am = context.getAssets();
try {
InputStream inputStream = am.open(name);
byte[] buffer = new byte[1024];
int len =0;
while((len = inputStream.read(buffer)) != -1){
baos.write(buffer,0,len);
}
} catch (IOException e) {
e.printStackTrace();
}
return baos.toString();
}
}
5)MainActivity中的代碼實(shí)現(xiàn)
[java] view plain copy
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.TextView;
import android.widget.Toast;
import com.bigkoo.pickerview.OptionsPickerView;
import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private TextView tv_address;
private ArrayListAddressBean provinceList = new ArrayList();//創(chuàng)建存放省份實(shí)體類的集合
private ArrayListString cities ;//創(chuàng)建存放城市名稱集合
private ArrayListListString citiesList= new ArrayList();//創(chuàng)建存放城市名稱集合的集合
private ArrayListString areas ;//創(chuàng)建存放區(qū)縣名稱的集合
private ArrayListListString areasList ;//創(chuàng)建存放區(qū)縣名稱集合的集合
private ArrayListListListString areasListsList = new ArrayList();//創(chuàng)建存放區(qū)縣集合的集合的集合
private OptionsPickerView mPvOptions;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tv_address = (TextView) findViewById(R.id.tv_address);
//獲取json字符串,用來解析以獲取集合
String jsonString = JsonUtils.getJsonString(MainActivity.this,
"province_data.json");
//解析json字符串,向各級集合中添加元素
parseJson(jsonString);
mPvOptions = new OptionsPickerView(this);
//設(shè)置三級聯(lián)動的效果
mPvOptions.setPicker(provinceList,citiesList,areasListsList,true);
//設(shè)置可以循環(huán)滾動,true表示這一欄可以循環(huán),false表示不可以循環(huán)
mPvOptions.setCyclic(true,false,false);
//設(shè)置默認(rèn)選中的位置
mPvOptions.setSelectOptions(0,0,0);
mPvOptions.setOnoptionsSelectListener(new OptionsPickerView.OnOptionsSelectListener() {
@Override
public void onOptionsSelect(int options1, int option2, int options3) {
//返回的分別是三個級別的選中位置
String city = provinceList.get(options1).getPickerViewText();
String address;
// 如果是直轄市或者特別行政區(qū)只設(shè)置市和區(qū)/縣
if ("北京市".equals(city) || "上海市".equals(city) || "天津市".equals(city) || "重慶市".equals(city) || "澳門".equals(city) || "香港".equals(city)) {
address = provinceList.get(options1).getPickerViewText()
+ " " + areasListsList.get(options1).get(option2).get(options3);
} else {
address = provinceList.get(options1).getPickerViewText()
+ " " + citiesList.get(options1).get(option2)
+ " " + areasListsList.get(options1).get(option2).get(options3);
}
tv_address.setText(address);
Toast.makeText(MainActivity.this,"我被點(diǎn)擊了",Toast.LENGTH_LONG).show();
}
});
//點(diǎn)擊文本框的時(shí)候,顯示地址選擇框
tv_address.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
mPvOptions.show();
}
});
}
//解析獲得的json字符串,放在各個集合中
private void parseJson(String json){
try {
//得到一個數(shù)組類型的json對象
JSONArray jsonArray = new JSONArray(json);
for (int i = 0; i jsonArray.length(); i++) {//對數(shù)組進(jìn)行遍歷得到每一個jsonobject對象
JSONObject provinceObject = (JSONObject) jsonArray.get(i);
String provinceName = provinceObject.getString("name");//得到省份的名字
provinceList.add(new AddressBean(provinceName));//向集合里面添加元素
JSONArray cityArray = provinceObject.optJSONArray("city");
cities = new ArrayList();//創(chuàng)建存放城市名稱集合
areasList = new ArrayList();//創(chuàng)建存放區(qū)縣名稱的集合的集合
for (int j = 0; j cityArray.length(); j++) {//遍歷每個省份集合下的城市列表
JSONObject cityObject = (JSONObject) cityArray.get(j);
String cityName = cityObject.getString("name");
cities.add(cityName);//向集合里面添加元素
JSONArray areaArray = cityObject.optJSONArray("area");
areas = new ArrayList();//創(chuàng)建存放區(qū)縣名稱的集合
for (int k = 0; k areaArray.length(); k++) {
String areaName = areaArray.getString(k);
areas.add(areaName);
}
areasList.add(areas);
}
citiesList.add(cities);
areasListsList.add(areasList);
}
} catch (JSONException e) {
e.printStackTrace();
}
}
}
那就給你說下二級聯(lián)動吧 ，三級道理也是一樣的。
根據(jù)第一級下拉框，點(diǎn)擊事件后，將id傳遞給服務(wù)器，服務(wù)器根據(jù)該id，經(jīng)過數(shù)據(jù)庫查詢，獲得二級下拉框的內(nèi)容，這里的內(nèi)容你可以用xml封裝，或者是直接寫成dom格式：如dom格式
服務(wù)端：
PrintWriter writer = response.getWriter();
writer.println("select");
while(rs.next()){
writer.println("option"+rs.getString("xxx")+"/option");
writer.flush();
}
writer.println("/select");
writer.close();
客戶端：
var selectStr=xmlHttp.responseText;//二集菜單的內(nèi)容
找個元素，將二級菜單項(xiàng)利用innerHTML插入到網(wǎng)頁中
document.getElementById("xx").innerHTML=selectStr;
不知道這樣說你明白不？
實(shí)現(xiàn)第三級，只需要在第二個下拉框里觸發(fā)事件后，將id傳遞給服務(wù)器，在經(jīng)過處理，將結(jié)果給第三級下拉框
后臺能夠打印出來，說明沒有問題。問題應(yīng)在前邊的接收端。看代碼返回的是json string，對于前端來說應(yīng)該僅僅是個string，而不是JS對象。
記得JQuery，發(fā)送request的時(shí)候有參數(shù)，可以自動把返回的json string變成js的object的。
重慶分公司
重慶分公司
