簡單的兩級聯動ajax載入省市
阿新 • • 發佈:2019-02-10
//新新增修改的時候繫結省市
jquery Code:
//ajax繫結省s $(function(){ var prov = '${tour.prov}'; $.ajax({ url: "./listProv.jspx", type: 'POST', dataType: 'JSON', timeout: 5000, error: function() { alert('載入省列表失敗!'); }, success: function(msg) { $("#province").empty(); $.each(eval(msg), function(i, item) { if(item.prov==prov){ $("<option value='" + item.prov + "' selected = 'selected'>" + item.prov + "</option>").appendTo($("#province")); }else{ $("<option value='" + item.prov + "'>" + item.prov + "</option>").appendTo($("#province")); } }); loadCity($("#province").val()); } }); $("#province").change(function() { loadCity($("#province").val()); }); function loadCity(parentid) { var city = '${tour.city}'; $.ajax({ url: './listCity.jspx?prov='+ parentid, type: 'POST', dataType: 'JSON', timeout: 5000, error: function() { alert('載入城市列表失敗!'); }, success: function(msg) { $("#city").empty(); $.each(eval(msg), function(i, item) { if(item.city ==city){ $("<option value='" + item.city + "' selected = 'selected'>" + item.city + "</option>").appendTo($("#city")); }else{ $("<option value='" + item.city + "'>" + item.city + "</option>").appendTo($("#city")); } }); } }); } })
如果get方式出現中文亂碼的時候:
那麼ajax【get方式】附帶引數的時候需要加個函式:encodeURIComponent
即:
url: './listCity.jspx?prov='+ encodeURIComponent(parentid),
說明:
encodeURIComponent方法在編碼單個URIComponent(指請求引數)應當是最常用的,它可以講引數中的中文、特殊字元進行轉義,而不會影響整個URL。
具體詳情請看:
CSDN發帖關於ajax get方式亂碼:
對函式URIComponent()的具體說明: