lianxi.html 6.8 KB
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>聯係我們</title>
    <link rel="stylesheet" href="__TMPL__/public/assets/css/base.css">
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=hG4FuySg0nLRGkY8pQZsGQVA8jCb81F3"></script>
    <style>
        .BMapLabel{
            width: 173px;
            height: 20px;
            margin-top: -10px !important;
            margin-left: 10px !important;
            /*padding-left: 10px !important;*/
            line-height: 24px !important;
            text-align: center !important;
            /*border: 1px solid black !important;*/
        }
        #map{
            margin-top:35px;
        }
        .anchorBL{
            display: none !important;
        }
    </style>
</head>
<body>
<div class="box2">
    <!--header-->
    <header>
        <include file="public@nav"/>
    </header>
    <!-- 侧边导航-->
    <div class="banner_aside banner_aside2">
        <include file="public@header"/>
    </div>
    <!--main-->
    <div class="ab2_main">
        <div class="contact_box">
            <div class="ab2_title" style="border:0">
                <a href="">首頁</a>
                <span> > </span>
                <a href="">聯係我們</a>
            </div>
            <div class="ab2_con">
                <div class="contact_tit">
                    <h2>聯係我們</h2>
                    <p><span>/</span>CONTACT US</p>
                </div>
                <div style="width:1054px;height:449px;border:#ccc solid 1px;font-size:12px" id="map"></div>
            </div>
            <div class="contact_con">
                <div class="contact_con_left">
                    <h2>澳德綜合健康中心有限公司 </h2>
                    <div class="contact_con_left1">
                        <p>地址 : 香港尖沙咀科學館道14號新文華中心B座707室</p>
                        <p>電話 : +852 2805 5997</p>
                        <p>傳真 : +852 28336798</p>
                        <p>電郵 : info@aodehealthcare.com</p>
                    </div>
                </div>
                <div class="contact_con_right">
                        <ul>
                            <li>
                                <label>
                                    姓名
                                </label>
                                <input type="text" class="inpTxt" name="name">
                            </li>
                            <li>
                                <label>電話</label>
                                <input type="text" class="inpTxt" name="phone">
                            </li>
                            <li>
                                <label>郵箱</label>
                                <input type="text" class="inpTxt" name="email">
                            </li>
                        </ul>
                        <div class="contact_tarea">
                            <p>內容</p>
                            <textarea id="content"></textarea>
                        </div>
                        <button type="button" onclick="add()" class="contact_btn">提交</button>
                </div>
            </div>
        </div>
    </div>
    <!--footer-->
    <footer>
        <include file="public@footer"/>
    </footer>
</div>

<script>
    //点击提交客户资料
    function add(){
        name = $("input[name='name']").val();
        phone = $("input[name='phone']").val();
        email = $("input[name='email']").val();
        content = $('#content').val();
        if(phone==''){
            alert('请填写姓名电话');
        }else{
            if(name==''){
                alert('请填写姓名电话');
            }else{
                $.post("{:url('Contact/lx_add')}",{name:name,phone:phone,email:email,content:content},function(data){
                    alert('提交成功');
                });
            }
        }

    }
</script>

<script type="text/javascript" src="__TMPL__/public/assets/js/jquery.js"></script>
<script type="text/javascript" src="__TMPL__/public/assets/js/index.js"></script>
<script type="text/javascript">
    $('.inpTxt').each(function () {
        $(this).focus(function(){
            $(this).parents("li").css('border-bottom','1px solid #E29C6D')
        });
    });
    $('.inpTxt').each(function () {
        $(this).blur(function(){
            $(this).parents("li").css('border-bottom','1px solid rgba(230,230,230,1)')
        });
    });


    //创建和初始化地图函数:
    function initMap(){
        createMap();//创建地图
        setMapEvent();//设置地图事件
        addMapControl();//向地图添加控件
        addMapOverlay();//向地图添加覆盖物
    }
    function createMap(){
        map = new BMap.Map("map");
        map.centerAndZoom(new BMap.Point("{$data.jingdu}","{$data.weidu}"),16);
    }
    function setMapEvent(){
        map.enableScrollWheelZoom();
        map.enableKeyboard();
        map.enableDragging();
        map.enableDoubleClickZoom()
    }
    function addClickHandler(target,window){
        target.addEventListener("click",function(){
            target.openInfoWindow(window);
        });
    }
    function addMapOverlay(){
        var markers = [
            {content:"{$data.address}",title:"{$data.title}",imageOffset: {width:-46,height:-21},position:{lat:22.337395,lng:114.176184}},
        ];
        for(var index = 0; index < markers.length; index++ ){
            var point = new BMap.Point(markers[index].position.lng,markers[index].position.lat);
            var marker = new BMap.Marker(point,{icon:new BMap.Icon("http://api.map.baidu.com/lbsapi/createmap/images/icon.png",new BMap.Size(20,25),{
                imageOffset: new BMap.Size(markers[index].imageOffset.width,markers[index].imageOffset.height)
            })});
            var label = new BMap.Label(markers[index].title,{offset: new BMap.Size(25,5)});
            var opts = {
                width: 200,
                title: markers[index].title,
                enableMessage: false
            };
            var infoWindow = new BMap.InfoWindow(markers[index].content,opts);
            marker.setLabel(label);
            addClickHandler(marker,infoWindow);
            map.addOverlay(marker);
        };
        var labels = [
        ];
        for(var index = 0; index < labels.length; index++){
            var opt = { position: new BMap.Point(labels[index].position.lng,labels[index].position.lat )};
            var label = new BMap.Label(labels[index].content,opt);
            map.addOverlay(label);
        };
    }
    //向地图添加控件
    function addMapControl(){
        var navControl = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:2});
        map.addControl(navControl);
    }
    var map;
    initMap();
</script>
</body>
</html>