百度地图web 关键字输入智能提示 省市区限制

百度地图web api 输入关键字提示仅仅给了一个很简单的demo，而且并未提供任何条件限制的api，今天遇到了个比较难受的问题是，网站本身是省市级3级区域选择，然后后面输入详细地址后要在百度地图上显示位置，就是如图所示的情况

很显然，我要在选择省市级后输入准确地址，比如我选择北京市东城区了，我要在东城区里面找成都饭店。。。你一输成都，这个智能提示会在全国范围内搜索，而且事件是自动注册在

var ac = new BMap.Autocomplete( //建立一个自动完成的对象
                                        {
                                            "input": "addr2",
                                            "location": map
                                        });

这个位置的，就是通过input，百度的js对addr2这个input注册监听事件，所以根本是没法改变条件的，唯一的办法就是拦截

百度api这个地方做得还比较明智，就是无论你是通过键盘输入还是js输入，都是触发智能提示的事件，那我就通过一个input（addr），把addr2中的val改为 省市区+addr，监听addr的onkeyup事件，onkeydown和百度地图的监听有冲突，把addr2 的位置用addr给覆盖掉，不能display:none，必须占位，不然百度的提示框位置会有问题。并且在选择智能提示后，详细地址不显示省市区的文字，如下的js里也有控制，具体如下：

 <input type="inputText" tabindex="7" id="addr2" name="addr2" placeholder="请输入具体的地址" style="width: 277px;visibility: hidden"/>
 <input type="inputText" tabindex="7" id="addr" name="addr" placeholder="请输入具体的地址" style="width: 277px;z-index: 1;margin-left: -282px;" οnkeyup="mysearch(this)"/>

  <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=EZPCgQ6zGu6hZSmXlRrUMTpr"></script>
@*                                    <div id="r-result">请输入<input type="text" id="suggestId" value="百度" style="width: 400px;"/>*@
@*                                    </div>*@
                                    <div id="searchResultPanel" style="border: 1px solid #C0C0C0; width: 400px; height: auto; display: none;"></div>
                                    <div id="l-map"></div>
                                    <script type="text/javascript">

                                        function mysearch(e) {
                                            if ($('#province3').val() == '') {
                                                layer.alert('请先选择省市区');
                                                $('#addr').val('');
                                                $('#addr2').val('');
                                            }
                                            $('#addr2').val($('#province3').val() + $('#city3').val() + $('#area3').val() + $(e).val());
                                        }

                                        // 百度地图API功能
                                        function G(id) {
                                            return document.getElementById(id);
                                        }

                                        var map = new BMap.Map("l-map");
                                        map.centerAndZoom("北京", 12); // 初始化地图,设置城市和地图级别。

                                        var ac = new BMap.Autocomplete( //建立一个自动完成的对象
                                        {
                                            "input": "addr2",
                                            "location": map
                                        });

                                        ac.addEventListener("onhighlight", function (e) { //鼠标放在下拉列表上的事件
                                         
                                            var str = "";
                                            var _value = e.fromitem.value;
                                            var value = "";
                                            if (e.fromitem.index > -1) {
                                                value = _value.province + _value.city + _value.district + _value.street + _value.business;
                                            }
                                            str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value;

                                            value = "";
                                            if (e.toitem.index > -1) {
                                                _value = e.toitem.value;
                                                value = _value.province + _value.city + _value.district + _value.street + _value.business;
                                              
                                            }
                                            str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value;
                                            G("searchResultPanel").innerHTML = str;
                                        });

                                        var myValue;
                                        ac.addEventListener("onconfirm", function(e) { //鼠标点击下拉列表后的事件
                                            var _value = e.item.value;
                                            myValue = _value.province + _value.city + _value.district + _value.street + _value.business;
                                            G("searchResultPanel").innerHTML = "onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue;

                                            setPlace();

                                            $('#addr').val(_value.street + _value.business);
                                            
                                          
                                        });

                                        function setPlace() {
                                            map.clearOverlays(); //清除地图上所有覆盖物
                                            function myFun() {
                                                
                                                var pp = local.getResults().getPoi(0).point; //获取第一个智能搜索的结果
                                                map.centerAndZoom(pp, 18);
                                                map.addOverlay(new BMap.Marker(pp)); //添加标注
                                              
                                            }

                                            var local = new BMap.LocalSearch(map, {
                                                //智能搜索
                                                onSearchComplete: myFun
                                            });
                                            local.search(myValue);
                                        }
                                    </script>

上张改后的图：