<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=Ga3BV2rAVcPtu1aH3QbeSxXN"></script> <script type="text/javascript" src="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.js"></script> <link rel="stylesheet" href="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.css" /> <script type="text/javascript" src="/webService/StoreSearch.ashx"></script> <script type="text/javascript" src="/js/string.format.js"></script>
<div class="contents_box" style="padding-bottom: 40px;">
<div class="select1">
<ul>
<li style="font-family: 黑体; font-size: 20px; color: #ffffff; opacity: 0.9;">1、请选择您要查询的产品</li>
<li style="font-size: 16px; font-family: 黑体; color: #ffffff; opacity: 0.8;">
<label>
<input type="radio" value="1" name="rbtType" checked="checked" style="width: 16px;
height: 16px; margin: 0px 7px;" />电壁挂热水器、燃气快速热水器或家庭中央热水炉
</label>
<label>
<input type="radio" value="2" name="rbtType" style="width: 16px; height: 16px; margin: 0px 7px;" />采暖\热水燃气壁挂两用炉
</label>
<label>
<input type="radio" value="3" name="rbtType" style="width: 16px; height: 16px; margin: 0px 7px;" />空气源热泵热水器
</label>
<label>
<input type="radio" value="4" name="rbtType" style=" width:16px; height:16px; margin:0px 7px;"/>净水机
</label>
<%-- <label>
<input type="radio" value="5" name="rbtType" style=" width:16px; height:16px; margin:0px 7px;"/>空气净化器
</label>--%>
</li>
</ul>
</div>
<div class="select2">
<ul>
<li style="font-family: 黑体; font-size: 20px; color: #ffffff; opacity: 0.9;">2、请选择您要查询的体验店地址</li>
<li style="font-size: 16px; font-family: 黑体;">
<div class="select">
<div class="select_bg" id="drpProvinceText" onclick="$(‘#drpProvince‘).show();$(‘#drpCity‘).hide();$(‘#drpStores‘).hide();">
<a class="Options00">请选择省份</a> <span class="Drop-down_box"><a>
<img src="images/select_sj.png" /></a></span>
</div>
<div class="clear">
</div>
<div class="selectBox" id="drpProvince" style="display: none; max-height: 300px;
overflow: auto; margin: 0px;">
<ul>
</ul>
</div>
</div>
<div class="select Lengthen2">
<div class="select_bg" id="drpCityText" onclick="$(‘#drpProvince‘).hide();$(‘#drpCity‘).show();$(‘#drpStores‘).hide();">
<a class="Options00">请选择城市</a> <span class="Drop-down_box"><a>
<img src="images/select_sj.png" /></a></span>
</div>
<div class="clear">
</div>
<div class="selectBox" style="display: none; max-height: 300px; overflow: auto; margin: 0px;"
id="drpCity">
<ul>
</ul>
</div>
</div>
<div class="select Lengthen">
<div class="select_bg Lengthen" id="drpStoresText" onclick="$(‘#drpProvince‘).hide();$(‘#drpCity‘).hide();$(‘#drpStores‘).show();">
<a class="Options00">请选择门店</a> <span class="Drop-down_box"><a>
<img src="images/select_sj.png" /></a></span>
</div>
<div class="clear">
</div>
<div class="selectBox Lengthen" style="display: none; max-height: 300px; overflow: auto;
margin: 0px;" id="drpStores">
<ul>
</ul>
</div>
</div>
</li>
</ul>
</div>
<div class="clear">
</div>
<div class="StoreInformation">
<div class="StoreInformation_left">
<div class="section shop_count">
共找到 <span>0</span> 家门店</div>
<div class="address_wrap">
<ul class="address_list">
</ul>
</div>
</div>
<div class="StoreInformation_right" id="allmap">
<a href="#">
<img src="images/storeMap.jpg" /></a>
</div>
</div>
</div>
<div class="lines02">
</div>
<div style="display: none">
<ul id="storeFormat">
<li onclick="selStoreMap(this,true)" id="map_{4}" lng="{5}" lat="{6}"><i>{0}</i>
<div class="address">
<h6 name="title">
{1}</h6>
<div name="address">
{2}</div>
<div class="tel">
电话：{3}</div>
</div>
</li>
</ul>
</div>
<script type="text/javascript">
var SeriesType = 1;
var s = location.search;
if (s.indexOf("?") == 0 && s.indexOf("t") > 0) {
var t = s.split("=")[1];
if (t && t <= 3) SeriesType = t;
}
function setProvinceSelection() {
$("#drpProvince ul").empty(); $("#drpCity ul").empty(); $("#drpStores ul").empty();
$("#drpProvince ul").html("<li onclick=\"selProvince(‘-1‘,‘请选择省份‘)\"> 请选择省份 </li>");
$("#drpCity ul").html("<li onclick=\"selCity(‘-1‘,‘请选择城市‘)\"> 请选择城市 </li>");
$("#drpStores ul").html("<li onclick=\"selStores(‘-1‘,‘请选择门店‘)\"> 请选择门店 </li>");
$("#drpProvinceText a").eq(0).text("请选择省份"); $("#drpCityText a").eq(0).text("请选择城市"); $("#drpStoresText a").eq(0).text("请选择门店");
$("#drpProvince").hide(); $("#drpCity").hide(); $("#drpStores").hide();
for (var i = 0; i < joProvince.length; i++) {
if (joProvince[i].SeriesType == SeriesType) {
$("#drpProvince ul").append(String.format("<li onclick=\"selProvince(‘{0}‘,‘{1}‘)\"> {1} </li>", joProvince[i].ProvinceID, joProvince[i].ProvinceName));
}
}
}
var nowid = 0;
function selProvince(id, txt) {
$("#drpProvinceText a").eq(0).text(txt);
$("#drpProvince").hide();
if (nowid == id) return;
$("#drpCity ul").html("<li onclick=\"selCity(‘-1‘,‘请选择城市‘)\"> 请选择城市 </li>");
$("#drpStores ul").html("<li onclick=\"selStores(‘-1‘,‘请选择门店‘)\"> 请选择门店 </li>");
$("#drpCityText a").eq(0).text("请选择城市"); $("#drpStoresText a").eq(0).text("请选择门店");
GetTowns(id);
nowid = id;
}
function selCity(id, txt) {
$("#drpCityText a").eq(0).text(txt);
$("#drpCity").hide();
if (nowid == id) return;
$("#drpStores ul").html("<li onclick=\"selStores(‘-1‘,‘请选择门店‘)\"> 请选择门店 </li>");
$("#drpStoresText a").eq(0).text("请选择门店");
GetDistrict(id);
nowid = id;
map.centerAndZoom(txt, 12);
map.clearOverlays();
AreaMapInit();
}
function selStores(id, txt) {
$("#drpStoresText a").eq(0).text(txt);
$("#drpStores").hide();
for (var i = 0; i < joDistrict.length; i++) {
if (joDistrict[i].DistrictID == id) {
$("#map_" + id).addClass("current").siblings().removeClass("current");
selStoreMap($("#map_" + id), true);
}
}
}
window.onload = function () {
$("input[name=‘rbtType‘]").each(function () {
if ($(this).val() == SeriesType) {
$(this).attr("checked", "checked");
}
});
$("input[name=‘rbtType‘]").change(function () {
SeriesType = $(this).val();
setProvinceSelection();
});
setProvinceSelection();
$("#drpProvince li").each(function () {
if ($.trim($(this).text()) == "江苏") {
$(this).click();
setTimeout(function () {
$("#drpCity li").each(function () {
if ($.trim($(this).text()) == "南京") {
$(this).click();
return false;
}
});
}, 2000);
return false;
}
});
};
function GetTowns(pid) {
if (pid <= 0) return;
$.ajax({
url: "/webService/StoreSearch.ashx?type=GetTowns&id=" + pid,
dataType: "json",
success: function (data) {
for (var i = 0; i < data.length; i++) {
if (data[i].TownID) {
$("#drpCity ul").append(String.format("<li onclick=\"selCity(‘{0}‘,‘{1}‘)\"> {1} </li>", data[i].TownID, data[i].TownName));
} else {
$("#drpCity ul").append(String.format("<li onclick=\"selCity(‘{0}‘,‘{1}‘)\"> {1} </li>", data[0].Province.Towns[i].TownID, data[0].Province.Towns[i].TownName));
}
}
}
});
}
var joDistrict, storeFormatHtml = "";
function GetDistrict(pid) {
if (pid <= 0) return;
$.ajax({
url: "/webService/StoreSearch.ashx?type=GetDistrict&id=" + pid,
dataType: "json",
success: function (data) {
joDistrict = data;
$(".address_list").empty();
storeFormatHtml = "";
for (var i = 0; i < data.length; i++) {
if (data[i].DistrictID) {
$("#drpStores ul").append(String.format("<li onclick=\"selStores(‘{0}‘,‘{1}‘)\"> {1}</li>", data[i].DistrictID, data[i].DistrictName));
storeFormatHtml = String.format($("#storeFormat").html(), i + 1, data[i].DistrictName, data[i].DistrictAddress, data[i].Phone, data[i].DistrictID, data[i].Lng, data[i].Lat);
} else {
$("#drpStores ul").append(String.format("<li onclick=\"selStores(‘{0}‘,‘{1}‘)\"> {1}</li>", data[0].Towns.District[i].DistrictID, data[0].Towns.District[i].DistrictName));
storeFormatHtml = String.format($("#storeFormat").html(), i + 1, data[0].Towns.District[i].DistrictName, data[0].Towns.District[i].DistrictAddress, data[0].Towns.District[i].Phone, data[0].Towns.District[i].DistrictID, data[0].Towns.District[i].Lng, data[0].Towns.District[i].Lat);
}
$(".address_list").append(storeFormatHtml)
}
$(".shop_count span").text(data.length);
}
});
}
var map = new BMap.Map("allmap"); // 创建Map实例
map.enableScrollWheelZoom(true);
map.centerAndZoom("南京", 12);
$(".address_list li").click(function () { $(this).addClass("current").siblings().removeClass("current"); });
function selStoreMap(ele, isHighlightItem) {
if (isHighlightItem) {
$(ele).addClass("current").siblings().removeClass("current");
}
var lng = $(ele).attr("lng");
var lat = $(ele).attr("lat");
if (lng == "null" || lat == "null") {
return;
}
var poi = new BMap.Point(lng, lat);
map.enableScrollWheelZoom();
var _title = $(ele).find("[name=title]").text();
var _address = $(ele).find("[name=address]").text();
var _telphone = $.trim($(ele).find(".tel").text()).substring(3);
var contentInfo = ‘<div style="margin:0;line-height:20px;padding:2px;">‘ +
‘<img src="/images/map1.gif" style="float:right;zoom:1;overflow:hidden;width:100px;height:100px;margin-left:3px;"/>‘ + ‘<p>‘ +
_address + ‘</p>‘ + ‘<br/><p>‘ + _telphone + ‘</p>‘ +
‘</div>‘;
var searchInfoWindow = null;
searchInfoWindow = new BMapLib.SearchInfoWindow(map, contentInfo, {
title: _title, //标题
width: 290, //宽度
height: 105, //高度
panel: "panel", //检索结果面板
enableAutoPan: true, //自动平移
searchTypes: [
BMAPLIB_TAB_TO_HERE, //到这里去
BMAPLIB_TAB_FROM_HERE //从这里出发
]
});
var marker = new BMap.Marker(poi); //创建marker对象
marker.enableDragging(); //marker可拖拽
map.addOverlay(marker); //在地图中添加marker
marker.addEventListener("click", function (e) {
searchInfoWindow.open(marker);
})
if (isHighlightItem) {
searchInfoWindow.open(marker);
}
}
function AreaMapInit() {
setTimeout(function () {
$(".address_list li").each(function () {
selStoreMap($(this), false);
});
}, 2000);
}
</script>
时间： 2024-10-01 02:33:54