=============================================
互相學習電話微信：18611436777（加微信注明事由）
<!--#include file="Function.asp" -->
<%
timestamp = Datediff("s","1970-01-01 00:00:00",now)
nonceStr = MakeRandStr(32)
signature = Get_Sign()
%>
<!DOCTYPE html>
<html>
<head>
<title>Demo</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="jquery-1.11.1.min.js"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script charset="utf-8" src="http://map.qq.com/api/js?v=2.exp"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script>
wx.config({
debug: false, // 開啟調試模式,調用的所有api的返回值會在客戶端alert出來，若要查看傳入的參數，可以在pc端打開，參數信息會通過log打出，僅在pc端時才會打印。
appId: '<%= AppId %>', // 必填，公眾號的唯一標識
timestamp: <%= timestamp %>, // 必填，生成簽名的時間戳
nonceStr: '<%= nonceStr %>', // 必填，生成簽名的隨機串
signature: '<%= signature %>',// 必填，簽名，見附錄1
jsApiList: [
'checkJsApi',
'onMenuShareTimeline',
'onMenuShareAppMessage',
'onMenuShareQQ',
'onMenuShareWeibo',
'onMenuShareQZone',
'hideMenuItems',
'showMenuItems',
'hideAllNonBaseMenuItem',
'showAllNonBaseMenuItem',
'translateVoice',
'startRecord',
'stopRecord',
'onVoiceRecordEnd',
'playVoice',
'onVoicePlayEnd',
'pauseVoice',
'stopVoice',
'uploadVoice',
'downloadVoice',
'chooseImage',
'previewImage',
'uploadImage',
'downloadImage',
'getNetworkType',
'openLocation',
'getLocation',
'hideOptionMenu',
'showOptionMenu',
'closeWindow',
'scanQRCode',
'chooseWXPay',
'openProductSpecificView',
'addCard',
'chooseCard',
'openCard'
]
});
wx.ready(function(){
var upMax=6;//最大上傳數量
// config信息驗證后會執行ready方法，所有接口調用都必須在config接口獲得結果之后，config是一個客戶端的異步操作，所以如果需要在頁面加載時就調用相關接口，則須把相關接口放在ready函數中調用來確保正確執行。對於用戶觸發時才調用的接口，則可以直接調用，不需要放在ready函數中。
$(".chooseImage").click(function(){
var canPic=upMax;
canPic=upMax-$(".delimg").length; //重新計算可上傳圖片數
wx.chooseImage({
count: canPic, // 默認9
sizeType: ['original', 'compressed'], // 可以指定是原圖還是壓縮圖，默認二者都有
sourceType: ['album', 'camera'], // 可以指定來源是相冊還是相機，默認二者都有
success: function (res) {
var localIds = res.localIds; // 返回選定照片的本地ID列表，localId可以作為img標簽的src屬性顯示圖片
syncUpload(localIds);
}
});
});
var syncUpload = function(localIds){
var localId = localIds.pop();
wx.uploadImage({
localId: localId,
isShowProgressTips:0,
success: function (res) {
var serverId = res.serverId; // 返回圖片的服務器端ID
$.get("SaveImg.asp?media_id="+serverId, function(result){
$("#img").append("<li class='weui_uploader_file'><img src='"+result+"'/><i class='delimg'>X</i></li>");
getPicItem();
});
if(localIds.length > 0){
syncUpload(localIds);
}
}
});
};
//獲取定位
//$(".getLocation").on("click", function(){
wx.getLocation({
type: 'gcj02', // 默認為wgs84的gps坐標，如果要返回直接給openLocation用的火星坐標，可傳入'gcj02'
success: function (res) {
var latitude = res.latitude; // 緯度，浮點數，范圍為90 ~ -90
var longitude = res.longitude; // 經度，浮點數，范圍為180 ~ -180。
$("#p_LatLng").html(longitude+','+latitude); //用戶的坐標
var url='GetAddress.asp?lat='+latitude+'&lng='+longitude;
$.ajax({
type:"get",
cache:false,
url:url,
success:function(res)
{
$("#p_Address").html(res); //中文地址
}
});
},
cancel: function (res) {
alert('用戶拒絕授權獲取地理位置','');
}
});
//});
//刪除圖片
$(document).on("click", ".delimg", function() {
$(this).parent().remove();
getPicItem();
})
//統計圖片數
function getPicItem()
{
//控制最大圖片數
var nowNum=$('.weui_uploader_file').length;
if (nowNum>=upMax){
$(".chooseImage").hide();
}else{
$(".chooseImage").show();
}
var Pic_List="";
$(".weui_uploader_file").each(function(){
var pic =$(this).find('img').attr("src");
Pic_List+=pic+"|";
});
$("#p_PicList").html(Pic_List);
}
});
</script>
<style>
#img{ margin:0px; padding:0px}
#img li{ width:100px; height:100px; position:relative; display:inline; float:left; margin:3px}
#img li img{width:100px; height:100px}
#img li i{ position:absolute; right:0px; top:0px; width:30px; height:30px; text-align:center; line-height:30px; background-color:#FF0000; color:#FFFFFF}
</style>
</head>
<body>
<div>
<button class="chooseImage" >選擇圖片</button>
<button class="getLocation">地理位置</button>
</div>
<ul id="img"></ul>
<div id="p_LatLng"></div>
<div id="p_Address"></div>
<div id="p_PicList"></div>
</body>
</html>
掃我微信交流
