62,046
社区成员
发帖
与我相关
我的任务
分享关于腾讯地图的一个问
关于腾讯地图的一个问,如下代码,如果加在有 <form id="form1" runat="server"> 的页面中,当点击 改变地图类型时 整个页面都会刷新,怎么能解决这个问题啊, 我页面是有很多服务器端控件,所以不能取消这一行
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="1.aspx.cs" Inherits="_1" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<title>地图类型切换</title>
<style type="text/css">
*{
margin:0px;
padding:0px;
}
body, button, input, select, textarea {
font: 12px/16px Verdana, Helvetica, Arial, sans-serif;
}
p{
width:603px;
padding-top:3px;
overflow:hidden;
}
.btn{
width:100px;
height:26px
}
#container {
min-width:603px;
min-height:667px;
}
</style>
<script charset="utf-8" src="https://map.qq.com/api/js?v=2.exp&key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77"></script>
<script>
var map;
//程序入口函数
function init() {
map = new qq.maps.Map(document.getElementById("container"), {
// 地图的中心地理坐标。
center: new qq.maps.LatLng(39.916527,116.397128),
zoomLevel:14 //等级缩放比例
});
}
//修改maptype来设置地图属性
function changeMapType(maptype){
switch(maptype){
case 'roadmap':
map.setMapTypeId(qq.maps.MapTypeId.ROADMAP);
break;
case 'satellite':
map.setMapTypeId(qq.maps.MapTypeId.SATELLITE);
break;
case 'hybrid':
map.setMapTypeId(qq.maps.MapTypeId.HYBRID);
break;
}
}
</script>
</head>
<body onload="init();">
<form id="form1" runat="server">
<div id="container"></div>
<p>鼠标点击下面按钮，可以切换地图类型。</p>
<div style='margin:5px'>
<button class='btn' onclick='changeMapType("roadmap")'>普通街道</button>
<button class='btn' onclick='changeMapType("satellite")'>卫星地图</button>
<button class='btn' onclick='changeMapType("hybrid")'>卫星地图(路网)</button>
<input id="Text1" type="text" />
</div>
</form>
</body>
</html>
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="1.aspx.cs" Inherits="_1" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<title>地图类型切换</title>
<style type="text/css">
*{
margin:0px;
padding:0px;
}
body, button, input, select, textarea {
font: 12px/16px Verdana, Helvetica, Arial, sans-serif;
}
p{
width:603px;
padding-top:3px;
overflow:hidden;
}
.btn{
width:100px;
height:26px
}
#container {
min-width:603px;
min-height:667px;
}
</style>
<script charset="utf-8" src="https://map.qq.com/api/js?v=2.exp&key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77"></script>
<script>
var map;
//程序入口函数
function init() {
map = new qq.maps.Map(document.getElementById("container"), {
// 地图的中心地理坐标。
center: new qq.maps.LatLng(39.916527,116.397128),
zoomLevel:14 //等级缩放比例
});
}
//修改maptype来设置地图属性
function changeMapType(maptype){
switch(maptype){
case 'roadmap':
map.setMapTypeId(qq.maps.MapTypeId.ROADMAP);
break;
case 'satellite':
map.setMapTypeId(qq.maps.MapTypeId.SATELLITE);
break;
case 'hybrid':
map.setMapTypeId(qq.maps.MapTypeId.HYBRID);
break;
}
}
</script>
</head>
<body onload="init();">
<form id="form1" runat="server">
<div id="container"></div>
<p>鼠标点击下面按钮，可以切换地图类型。</p>
<div style='margin:5px'>
<button class='btn' onclick='changeMapType("roadmap")'>普通街道</button>
<button class='btn' onclick='changeMapType("satellite")'>卫星地图</button>
<button class='btn' onclick='changeMapType("hybrid")'>卫星地图(路网)</button>
<input id="Text1" type="text" />
</div>
</form>
</body>
</html>
...全文
请发表友善的回复…
发表回复
weiyulin510037 2018-12-24
- 打赏
- 举报
解决了,我把它放在了iframe里面
非专业开发Five 2018-12-14
- 打赏
- 举报
你使用 <form id="form1" runat="server">后，这里面所有 runat="server"的控件操作都会返回服务端然后刷新页面后操作。
具体可以看看这篇文章
https://www.cnblogs.com/yaoxiaodan/p/5380612.html?tdsourcetag=s_pcqq_aiomsg
和这个
https://blog.csdn.net/bntx2jsqfehy7/article/details/80589580?tdsourcetag=s_pcqq_aiomsg
然后你就知道怎么解决刷新的问题了
APP开发王 2018-12-14
- 打赏
- 举报
可以用Ajax不用刷新页面。。。记住这是唯一的方法。
