ASP.Net按钮重新加载整个页面

时间:2014-11-18 22:58:49

标签: javascript asp.net google-maps

我正在涉及一些ASP.NET网页分页内容。我昨天刚开始就是一个菜鸟。

我尝试写一些基本的东西,有一个谷歌地图以及几个可以通过按钮删除的位置。 我发现当按下按钮时,标记会下降,但整个页面会重新加载并将谷歌地图窗口重置为其原始初始化状态。

任何建议,想法,方向都会很棒。

干杯

我的java脚本

<script type="text/javascript">

    var map;
    var myLatlng = new google.maps.LatLng(-27.4679, 153.0277);
    var googleMapOptions;

    function initialize()
    {
        googleMapOptions =
        {
            center: myLatlng,
            zoom: 15,
            panControl: true,
            zoomControl: true,
            zoomControlOptions: {
                style: google.maps.ZoomControlStyle.SMALL
            },
            scaleControl: true,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

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

    function addMyMarker()
    {

        var marker = new google.maps.Marker({
            position: myLatlng,
            map: map,
            draggable: true,
            animation: google.maps.Animation.DROP,
            title: "This a new marker!",
            icon: "http://maps.google.com/mapfiles/ms/micons/blue.png"
        });
        //alert('addMyMarker');
    }
</script>

我的html / asp

<body onLoad="initialize()">
<div id="map-canvas" style="z-index: 1; left: 46px; top: 102px; position: absolute; height: 440px; width: 481px">
    </div>

<form id="form1" runat="server">
<asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="images/WorldNormal.png" OnClick="OnClick" 
        OnMouseOver="src='images/WorldHighlight.png';" OnMouseOut="src='images/WorldNormal.png';" 
        style="z-index: 1; left: 549px; top: 88px; position: absolute; width: 87px; height: 21px" />
</form>
</body>

背后的代码

protected void OnClick(object sender, EventArgs e)
{
    Page.ClientScript.RegisterStartupScript(this.GetType(), "addMyMarker", "addMyMarker();", true);
}

1 个答案:

答案 0 :(得分:2)

这称为PostBack,是ASP.NET WebForms的重要组成部分。但是,您不需要它,因为您的OnClick方法只会在页面上添加一些JS。您可以在页面右侧为按钮定义OnClientClick事件,并避免PostBack。

<asp:ImageButton OnClientClick="addMyMarker(); return false;" />

(我删除了标签上不重要的属性,使我的答案更清晰)

注意最后的return false; - 告诉按钮不执行PostBack