0

// html

<!DOCTYPE html>


<head>


<title>
</title>


<link rel="stylesheet" type="text/css" href="style2.css">


<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

// 加载谷歌地图

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js? key=&sensor=true">

</script>

<script type="text/javascript">

    var myLatlng = new google.maps.LatLng(33.319914, 44.304771);

var marker = new google.maps.Marker({map: map, position:myLatlng, title:"Hello World!"});

var map = null;

function initialize() 
{

    var mapOptions = 
        {

            center: new google.maps.LatLng(33.319914, 44.304771),

        zoom: 12,

        mapTypeId: google.maps.MapTypeId.ROADMAP,

        disableDefaultUI: true,


    };


    var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);


    //  marker.setMap(map);



}

// 第二张带标记的地图

function initialize2() 
    {

            var mapOptions = 
        {

                center: new google.maps.LatLng(33.319914, 44.304771),

            zoom: 12,

            mapTypeId: google.maps.MapTypeId.ROADMAP,

            disableDefaultUI: true,

        };

        var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);

        marker.setMap(map);

    }   

google.maps.event.addDomListener(window, 'load', initialize);



</script>

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>  
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

<head>



<body>

<div id="map-canvas"/>

</div>

// 按钮用于加载第二张地图

<button onclick="initialize2()">Enter ID</button>

// 表单将加载第二个地图但刷新页面并返回第一个地图而没有标记

<form name="searchbox">
<input type="text" class="searchbox" name="searchterm"/>
<input type="image" src="images/opacbox1.png" class="searchbox_submit" value="Search"" ONCLICK="Javascript:doSearch()" onsubmit="javascript:doSearch()" />

<script type="text/javascript">


    function doSearch() 
    {

                searchvalue = document.searchbox.searchterm.value 

        if (searchvalue == "1") 
        {
                    initialize2();
                }
        else 
        {
            alert("no good");
        }   
        }


</script>

</body>



</html>

// 如果有更好的方法来使用 seachbox 或按钮加载标记，我整天都在尝试

// CSS

body

{
      }

#map-canvas 
{ 
    height: 500px;
    width: 500px;
    margin: 50px 50px 50px 50px;
}

#searchwrapper 
{
    width:310px;
    height:40px;
    background-image:url('images/searchbox6.png');
    background-repeat:no-repeat;
    padding:0px;
    margin:0px;
    position:relative;
}

#searchwrapper form 
{ 
    display: inline; 
}

.searchbox 
{
    border:0px;
    background-color:transparent;
    position:absolute;
    top:4px;
    left:9px;
    width:256px;
    height:28px;
    color: #fff;
}

.searchbox_submit 
{
    border:0px; /*important*/
    background-color:transparent; /*important*/
    position:absolute; /*important*/
    top:4px;
    left:265px;
    width:32px;
    height:28px;
}
4

1 回答 1

0

阻止表格登顶，如下所示：

 $('#upload').submit(function(e){
     e.preventDefault(); 
     ... 
 });

希望这可以帮助 ：/

于 2013-08-02T02:35:19.973 回答