评论 - lizhenqiu blog

#²⁰³⁴

作者：广西南宁市

当别人说「不」或问「为什么」，请用你性感的、带情绪的脑洞回击，「why not」

文章：他不是脾气暴躁，只是不能被打扰发表时间：2016-11-04, 11:10:08

展开↯

#²⁰³⁵

作者：广西南宁市

确保你不再被叫去做某件事的最好方法就是，在第一次做的时候就搞砸它

文章：他不是脾气暴躁，只是不能被打扰发表时间：2016-11-04, 10:47:40

展开↯

#²⁰³⁶

作者：广西南宁市

能不能取代是一回事，允许不允许取代是另一回事。这一回事和那一回事总要博弈一番

文章：他不是脾气暴躁，只是不能被打扰发表时间：2016-11-04, 10:46:37

展开↯

#²⁰³⁷

作者：广西南宁市

存在的是有原因的，消亡也是有原因的。所以说无论网络视频能否代替电视，都是历史的车轮在推动，任何人都不能完全肯定说A或者B，所以，现在任何人下断言都是早的！

文章：他不是脾气暴躁，只是不能被打扰发表时间：2016-11-04, 10:46:24

展开↯

#²⁰³⁸

作者：广西南宁市

网页滚动条拉到最低端

$(document).height() == $(window).height() + $(window).scrollTop()

Run code

Cut to clipboard

当网页高度不足浏览器窗口时$(document).height()返回的是$(window).height()
$("body").height()：body可能会有边框，获取的高度会比$(document).height()小；
$("html").height()：在不同的浏览器上获取的高度的意义会有差异，说白了就是浏览器不兼容。
$(window).height()值有问题，返回的不是浏览器窗口的高度？
原因：网页没有加上<!DOCTYPE>声明。

文章：常用html、demo代码发表时间：2016-11-04, 10:14:50

展开↯

#²⁰³⁹

作者：广西南宁市

使用jquery中height()方法获取各种高度大全

alert($(window).height()); //浏览器当前窗口可视区域高度
alert($(document).height()); //浏览器当前窗口文档的高度
alert($(document.body).height());//浏览器当前窗口文档body的高度
alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度 包括border padding margin
alert($(window).width()); //浏览器当前窗口可视区域宽度
alert($(document).width());//浏览器当前窗口文档对象宽度
alert($(document.body).width());//浏览器当前窗口文档body的高度
alert($(document.body).outerWidth(true));//浏览器当前窗口文档body的总宽度 包括border padding margin

Run code

Cut to clipboard

文章：常用html、demo代码发表时间：2016-11-04, 10:11:19

展开↯

#²⁰⁴⁰

作者：北京市

滚动闪
原因：滚动固定的时候，原来的菜单导航高度0不在文档流里面，导致文档高度变化变小减去文档流外的后固定导航栏

文章：他不是脾气暴躁，只是不能被打扰发表时间：2016-11-04, 00:42:21

展开↯

#²⁰⁴¹

作者：北京市

Js/Jquery获取input file的文件名

html代码:
    <input type="file" name="file" id="file" class="input_text80"></input>
js:
方法一：字符串截取
var file = $("#file").val();
var fileName = getFileName(file);
 
function getFileName(o){
    var pos=o.lastIndexOf("\\");
    return o.substring(pos+1);  
}
 
方法二：正则表达式
var file = $("#file").val();
var strFileName=file.replace(/^.+?\\([^\\]+?)(\.[^\.\\]*?)?$/gi,"$1");  //正则表达式获取文件名，不带后缀
var FileExt=file.replace(/.+\./,"");   //正则表达式获取后缀

Run code

Cut to clipboard

文章：简洁七牛图床图片上传外链源码发表时间：2016-11-04, 00:40:41

展开↯

#²⁰⁴²

作者：北京市

JavaScript 获取当前时间戳：
第一种方法：

var timestamp = Date.parse(new Date());
结果：1280977330000

Run code

Cut to clipboard

第二种方法：

var timestamp = (new Date()).valueOf();
结果：1280977330748

Run code

Cut to clipboard

第三种方法：


var timestamp=new Date().getTime()；
结果：1280977330748

Run code

Cut to clipboard

第一种：获取的时间戳是把毫秒改成000显示，
第二种和第三种是获取了当前毫秒的时间戳。

文章：简洁七牛图床图片上传外链源码发表时间：2016-11-04, 00:39:00

展开↯

#²⁰⁴³

作者：北京市

七牛自定义资源下载名

http://qiniuphotos.qiniudn.com/gogopher.jpg?download/test.jpg

Run code

Cut to clipboard

文章：简洁七牛图床图片上传外链源码发表时间：2016-11-04, 00:37:15

展开↯

#²⁰⁴⁴

作者：北京市

公盘网盘上传代码

<?php
require_once  'vendor/autoload.php';
header('Access-Control-Allow-Origin:*');
use Qiniu\Auth;
$bucket = 'wailian';
$accessKey = '';
$secretKey = '';
$auth = new Auth($accessKey, $secretKey);
//$upToken = $auth->uploadToken($bucket);
$policy = array(
    'returnUrl' => 'http://pan.lizhenqiu.com/fileinfo.php',
    'returnBody' => '{"fname": $(key)}',
);
$upToken = $auth->uploadToken($bucket, null, 3600, $policy);
?><!DOCTYPE html>
<html>
<head>
<title>公盘 -lizhenqiu.com</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="format-detection" content="telephone=no" />
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/ecmascript" src="md5.js"></script>

<style>@supports (display:none) {
      dot {
        display: inline-block; 
        width: 3ch;
        text-indent: -1ch;
        vertical-align: bottom; 
        overflow: hidden;
        animation: dot 3s infinite step-start both;
        /* 等宽字体很重要 */
        font-family: Consolas, Monaco, monospace;
    }
}

@keyframes dot {
    33% { text-indent: 0; }
    66% { text-indent: -2ch; }
}</style></head>

<body>
<p>请填写标题、简介、选择要上传的RAR文件包</p>
<div id="ddimgupoloing" style="display:none;color: red;">正在上传文件<dot>...</dot></div>


<form id="myform" autocomplete="off" name="myform" onsubmit="return check();" method="post" action="http://up.qiniu.com" enctype="multipart/form-data">
<input name="key" id="key" type="hidden" value="">
  <input name="token" type="hidden" value="<?php echo $upToken;?>">
  <p><input name="title" type="text" autocomplete="off" id="intitle" placeholder="请填写标题" /></p>
  <p><input name="jianjie" type="text" autocomplete="off" id="injianjie" placeholder="请填写简介" /></p>
  <p><input name="file" autocomplete="off" id="f" type="file" style="
    background: #eee;
    border: 1px solid #eee;
    border-right: 1px solid #000;
" /></p>
  <input type="submit" value="Submit" style="display:none;" />
</form><script type="text/javascript">

function asq(title,jianjie,durl,types){
	$.ajax( {
		url: '/up.php?title='+title+'&jianjie='+jianjie+'&durl='+durl+'&types='+types, //这里是静态页的地址
		type: "GET", //静态页用get方法，否则服务器会抛出405错误
		//dataType: "json",
		//cache: false,
		//async: false,
		beforeSend: function(){
		 // Handle the beforeSend event
		},
		success: function(data){
			//var result = $(data).find("另一个html页面的指定的一部分").html();
			return true;
		}
	});
	return false;
}


	function check(){
		var s=$('#f').val();
		var injianjie=$('#injianjie').val();
		var intitle=$('#intitle').val();
		if(!intitle){
			//alert('请填写标题');
			//location.href = '/out.php';
			var strFileName=s.replace(/^.+?\\([^\\]+?)(\.[^\.\\]*?)?$/gi,"$1");
			$('#intitle').val(strFileName);
			timedMsg();
			return false;
		}
		if(!injianjie){
			//alert('请填写简介');
			var strFileName=s.replace(/^.+?\\([^\\]+?)(\.[^\.\\]*?)?$/gi,"$1");
			$('#injianjie').val(strFileName);
			timedMsg();
			//location.href = '/out.php';
			return false;
		}
		
		var types=selectFile(document.getElementById("f"));
		
		//alert(s);
		var h=$('#key').val();
		if(!s || h) return false;
		var timestamp = Date.parse(new Date());
		var hash = hex_md5(s)+timestamp;
		
		$('#key').val(hash);
		asq(intitle,injianjie,hash,types);
	}
function selectFile(input) {
 
    var fileName = input.value;
    if(fileName.length > 1 && fileName ) {       
        var ldot = fileName.lastIndexOf(".");
        var type = fileName.substring(ldot + 1);
        return type;
        if(type != "rar") {
            alert('请上传rar压缩包文件');
			location.href = '/out.php';
            //清除当前所选文件
            input.outerHTML=input.outerHTML.replace(/(value=\").+\"/i,"$1\"");
			return false;
        }
    }
	return false;
	//return true;
}
function timedMsg()
　　{
	var s=$('#f').val();
	if(s){
		check();
		var h=$('#key').val();
		if(h){
			$('#myform').css('display','none');
			$('#ddimgupoloing').css('display','');
			document.getElementById("myform").submit();
		}
		return false;
	}
　　setTimeout("timedMsg()",1000);
　　}
setTimeout("timedMsg()",3000);
</script>  

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- blog -->
<ins class="adsbygoogle"
     style="display:inline-block;width:320px;height:100px"
     data-ad-client="ca-pub-7446801070784593"
     data-ad-slot="7895142255"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>


</body>

</html>

Run code

Cut to clipboard

文章：简洁七牛图床图片上传外链源码发表时间：2016-11-04, 00:36:02

展开↯

#²⁰⁴⁵

作者：广西南宁市

在七牛回调的中，是否有返回文件大小属性。属性是什么
上传策略的callbackBody字段设置fsize这个魔法变量即可：
http://developer.qiniu.com/docs/v6/api/overview/up/response/vars.html#magicvar

php的话就是生成token的地方

 $bucket = Config::BUCKET_NAME;
 $accessKey = Config::ACCESS_KEY;
 $secretKey = Config::SECRET_KEY;
 $auth = new Auth($accessKey, $secretKey);

 $policy = array(
 'callbackUrl' => 'http://172.30.251.210/callback.php',
 'callbackBody' => '{"fname":"$(fname)","fsize":"$(fsize)","fkey":"$(key)","desc":"$(x:desc)","uid":' . $uid . '}'
);

 $upToken = $auth->uploadToken($bucket, null, 3600, $policy);

header('Access-Control-Allow-Origin:*');
 echo $upToken;

Run code

Cut to clipboard

文章：简洁七牛图床图片上传外链源码发表时间：2016-11-03, 17:51:23

展开↯

#²⁰⁴⁶

作者：广西南宁市

a链接点击执行js代码

<a href="javascript: alert('test');">

Run code

Cut to clipboard

文章：常用html、demo代码发表时间：2016-11-03, 17:49:55

展开↯

#²⁰⁴⁷

作者：广西南宁市

有人问我为什么每天一上班就犯困想睡觉...或许是因为，工作是梦开始的地方吧

文章：他不是脾气暴躁，只是不能被打扰发表时间：2016-11-03, 14:23:17

展开↯

#²⁰⁴⁸

作者：广西南宁市

百度地图手机移动端版天材医疗器械联系我们

<script type="text/javascript" src="http://api.map.baidu.com/api?type=quick&ak=X8u8xx9GzO88EIydfLbTsvbK&v=1.0"></script>

<!---------------------------------- 地图开始 ---------------------------------->
<div class="lxfsditu"  id="map" style="border:1px solid #ccc; width:15rem; height:11.85rem;">
</div>
<!---------------------------------- 地图结束 ---------------------------------->

<script type="text/javascript">
	// 百度地图API功能
	var map = new BMap.Map("map");
	map.centerAndZoom(new BMap.Point(108.312475,22.772913), 14);

	map.addControl(new BMap.ZoomControl());  //添加地图缩放控件
	var marker1 = new BMap.Marker(new BMap.Point(108.312475,22.772913));  //创建标注
	map.addOverlay(marker1);                 // 将标注添加到地图中
	//创建信息窗口
	var infoWindow1 = new BMap.InfoWindow("广西天材医疗器械有限公司<br>南宁市金凯路11号荣港城二期12座16楼E号");
	marker1.addEventListener("click", function(){this.openInfoWindow(infoWindow1);});
	</script>

Run code

Cut to clipboard

文章：百度地图显示多个标注点发表时间：2016-11-02, 18:03:50

展开↯

#²⁰⁴⁹

作者：广西南宁市

百度地图PC版代码

<div class="ditu" id="map" style="width:900px; height:396px; border:1px solid #ccc; margin:15px auto 0 auto;"></div>
<script src="http://api.map.baidu.com/api?v=1.3" type="text/javascript"></script>
<script type="text/javascript">
    //创建和初始化地图函数：
    function initMap(){
        createMap();//创建地图
        setMapEvent();//设置地图事件
        addMapControl();//向地图添加控件
        addMapOverlay();//向地图添加覆盖物
    }
    function createMap(){
        map = new BMap.Map("map");
        map.centerAndZoom(new BMap.Point(<?php echo $longitude;?>,<?php echo $latitude;?>),19);
    }
    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:"<?php echo $address;?>",title:"<?php echo $company;?>",imageOffset: {width:-46,height:-21 },position:{lat:<?php echo $latitude;?>,lng:<?php echo $longitude;?>}}
        ];
        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);
        };
    }
    //向地图添加控件
    function addMapControl(){
        var scaleControl = new BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT});
        scaleControl.setUnit(BMAP_UNIT_IMPERIAL);
        map.addControl(scaleControl);
        var navControl = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE});
        map.addControl(navControl);
        var overviewControl = new BMap.OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:false});
        map.addControl(overviewControl);
    }
    var map;
    initMap();
</script>

Run code

Cut to clipboard

文章：百度地图显示多个标注点发表时间：2016-11-02, 18:01:44

展开↯

#²⁰⁵⁰

作者：广西南宁市

广羽人门店分布地图多点标注2
添加设置覆盖物标注点文字标签

<GZ:list sql="select * from gz_mendianbiaozhu where status='1' order by listorder desc" key='i'>

<?php
$meidanfenbu[]=$r;
?>
</GZ:list>
<!---------------------------------------- 栏目 start ---------------------------------------->
<div class="lanmu">
   <ul class="xuanxiang xuanxiangnew-lij clearfix"><include file="A:l"/>
   </ul>
</div>
<!---------------------------------------- 栏目 end ---------------------------------------->

<?php
	$zms=array(
		'1'=>'A',
		'2'=>'B',
		'3'=>'C',
		'4'=>'D',
		'5'=>'E',
		'6'=>'F',
		'7'=>'G',
		'8'=>'H',
		'9'=>'I',
		'10'=>'J',
		'11'=>'K',
		'12'=>'L',
		'13'=>'M',
		'14'=>'N',
		'15'=>'O',
		'16'=>'P',
		'17'=>'Q',
		'18'=>'R',
		'19'=>'S',
		'20'=>'T',
		'21'=>'U',
		'22'=>'V',
		'23'=>'W',
		'24'=>'X',
		'25'=>'Y',
		'26'=>'Z'
	);
?>

<!---------------------------------------- 门店分布内容 start ---------------------------------------->
<div class="mdfbbox">
   <div class="fbbt">广西南宁市范围广羽人门店分布地图：</div>
   <div class="gxditu" id="map" style="width:900px; height:365px; border:1px solid #ccc;"></div>
   <div class="fbbt" style="margin-top:30px;">广西南宁市广羽人所有店铺地址：</div>
   
   <div class="fbdzlf" style="width:900px;    border-right: none;"><?php
	foreach($meidanfenbu as $i=>$r){
	$ik++;
	if($nnssvs) $nnssvs.= ',{ title: "'.$r['mingc'].'", point: "'.$r['zuobo'].'", address: "'.$r['dizhi'].'",tel:"'.$r['tel'].'"}';
	else $nnssvs= '{ title: "名称：'.$r['mingc'].'", point: "'.$r['zuobo'].'", address: "'.$r['dizhi'].'",tel:"'.$r['tel'].'"}';
	$lns=explode(',',$r['zuobo']);
	$ln=$lns['0'];
	$la=$lns['1'];
   ?>
		  
		<div onclick="getdddsnew('{$ln}','{$la}','{$r.mingc}','{$r.dizhi}','{$r.tel}');" style="cursor: pointer;float:left;<?php
			if(($i%2)) echo 'width:425px;margin-left: 25px;';
			else echo 'width:448px;    border-right: 1px dashed #ccc;';
			//if($i>2) echo 'margin-top: 15px;';
		?>padding-bottom:15px;">
      <div style="width:100%;" class="dianming"><span style="color:red;"><?php echo $zms[$ik];?></span> {$r.mingc}</div>
      <P style="width:100%;" class="diandizhi" style="margin-bottom:15px;">{$r.dizhi}</P></div>
      <?php
	  }
	  
	  ?>
   </div>
   
  
</div>
<!---------------------------------------- 门店分布内容 end ---------------------------------------->


<script>
	var load = document.createElement("script");  
	load.src = "http://api.map.baidu.com/api?v=1.4&callback=map_init";  
	document.body.appendChild(load); 

var markerArr = [ 
	<?php echo $nnssvs;?>
	//{ title: "名称：金外滩商务大厦", point: "108.33058,22.815521", address: "金外滩商务大厦1301"},
	//{ title: "名称：人民公园", point: "108.336858,22.83404", address: "人民公园地址<br>电话13607875450 "}
];  
  
                //var map; //Map实例  
				//map = new BMap.Map("map"); 
                function map_init() {  
                    map = new BMap.Map("map");
                    //第1步：设置地图中心点，南宁市政府  
                    var point = new BMap.Point(108.33058,22.815521);  
                    //第2步：初始化地图,设置中心点坐标和地图级别。  
                    map.centerAndZoom(point, 13);  
                    //第3步：启用滚轮放大缩小  
                    map.enableScrollWheelZoom(true);  
                    //第4步：向地图中添加缩放控件  
                    var ctrlNav = new window.BMap.NavigationControl({  
                        anchor: BMAP_ANCHOR_TOP_LEFT,  
                        type: BMAP_NAVIGATION_CONTROL_LARGE  
                    });  
                    map.addControl(ctrlNav);  
                    //第5步：向地图中添加缩略图控件  
                    var ctrlOve = new window.BMap.OverviewMapControl({  
                        anchor: BMAP_ANCHOR_BOTTOM_RIGHT,  
                        isOpen: 1  
                    });  
                    map.addControl(ctrlOve);  
  
                    //第6步：向地图中添加比例尺控件  
                    var ctrlSca = new window.BMap.ScaleControl({  
                        anchor: BMAP_ANCHOR_BOTTOM_LEFT  
                    });  
                    map.addControl(ctrlSca);  
  
                    //第7步：绘制点    
                    for (var i = 0; i < markerArr.length; i++) {  
                        var p0 = markerArr[i].point.split(",")[0];  
                        var p1 = markerArr[i].point.split(",")[1];  
                        var maker = addMarker(new window.BMap.Point(p0, p1), i);  // i 标注字母顺序
                        addInfoWindow(maker, markerArr[i], i);   
                    }  
                }  
  
                // 添加标注  
                function addMarker(point, index) {  
                    var myIcon = new BMap.Icon("http://api.map.baidu.com/img/markers.png",  
                        new BMap.Size(23, 25), {  
                            offset: new BMap.Size(10, 25),  
                            imageOffset: new BMap.Size(0, 0 - index * 25)  
                        });  
                    var marker = new BMap.Marker(point, { icon: myIcon });  
                    map.addOverlay(marker);  
						//设置覆盖物的文字标签
						var label = new BMap.Label(markerArr[index].title,{offset:new BMap.Size(20,-10)});
						marker.setLabel(label);
						//end
                    return marker;  
                }  
  
                // 添加信息窗口  
                function addInfoWindow(marker, poi) {  
					
                    //pop弹窗标题  
                    var title = '<div style="font-weight:bold;color:#CE5521;font-size:14px">' + poi.title + '</div>';  
                    //pop弹窗信息  
                    var html = [];  
					
					html.push('<p style="vertical-align:top;line-height:16px">地址:'+poi.address+'</p><p style="vertical-align:top;line-height:16px">电话:'+poi.tel+'</p>');
                    /*html.push('<table cellspacing="0" style="table-layout:fixed;width:100%;font:12px arial,simsun,sans-serif"><tbody>');  
                    html.push('<tr>');  
                    html.push('<td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">地址:</td>');  
                    html.push('<td style="vertical-align:top;line-height:16px">' + poi.address + ' </td>');
					html.push('</tr><tr><td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">电话:</td>');
					html.push('<td style="vertical-align:top;line-height:16px">' + poi.tel + ' </td>');					
                    html.push('</tr>');  
                    html.push('</tbody></table>');  */
                    var infoWindow = new BMap.InfoWindow(html.join(""), { title: title/*, width: 200*/ });  
  
                    var openInfoWinFun = function () {  
                        marker.openInfoWindow(infoWindow);  
                    };  
                    marker.addEventListener("click", openInfoWinFun);  
                    return openInfoWinFun;  
                }  
  
                //异步调用百度js  
                /*function map_load() {  
                    var load = document.createElement("script");  
                    load.src = "http://api.map.baidu.com/api?v=1.4&callback=map_init";  
                    document.body.appendChild(load);  
                }  
                window.onload = map_load; */ 
				//点击打开标注点移动到标注点地图中心
				function getdddsnew(ln,la,title,address,tel){
				
					//pop弹窗标题  
                    var title = '<div style="font-weight:bold;color:#CE5521;font-size:14px">' + title + '</div>';  
                    //pop弹窗信息  
                    /*var html = [];  
                    html.push('<table cellspacing="0" style="table-layout:fixed;width:100%;font:12px arial,simsun,sans-serif"><tbody>');  
                    html.push('<tr>');  
                    html.push('<td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">地址:</td>');  
                    html.push('<td style="vertical-align:top;line-height:16px">' + address + ' </td>');
					html.push('</tr><tr><td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">电话:</td>');
					html.push('<td style="vertical-align:top;line-height:16px">' + tel + ' </td>');					
                    html.push('</tr>');  
                    html.push('</tbody></table>');*/
					html='<p style="vertical-align:top;line-height:16px">地址:'+address+'</p><p style="vertical-align:top;line-height:16px">电话:'+tel+'</p>';
					
				
					//alert(lnat);
					//map.panTo(new BMap.Point(116.409, 39.918));平滑移动至新中心点 如果移动距离超过了当前地图区域大小，则地图会直跳到该点。
					var Point=new BMap.Point(ln,la);
					var opts = {    
					 //width : 250,     // 信息窗口宽度    
					 //height: 100,     // 信息窗口高度    
					 title : title  // 信息窗口标题   
					}    
					var infoWindow = new BMap.InfoWindow(html, opts);  // 创建信息窗口对象    
					//map.openInfoWindow(infoWindow, map.getCenter());      // 打开信息窗口
					map.openInfoWindow(infoWindow, Point);
				}
				
				//map.panTo(new BMap.Point(116.409, 39.918));
            </script>

Run code

Cut to clipboard

百度地图API示例百度地图API JavaScript API > 开发指南

文章：百度地图显示多个标注点发表时间：2016-11-02, 18:00:29

展开↯

#²⁰⁵¹

作者：广西南宁市

广羽人优化后版本1
新增点击移动到标注点打开标注点信息窗口

<GZ:list sql="select * from gz_mendianbiaozhu where status='1' order by listorder desc" key='i'>

<?php
$meidanfenbu[]=$r;
?>
</GZ:list>
<!---------------------------------------- 栏目 start ---------------------------------------->
<div class="lanmu">
   <ul class="xuanxiang xuanxiangnew-lij clearfix"><include file="A:l"/>
   </ul>
</div>
<!---------------------------------------- 栏目 end ---------------------------------------->

<?php
	$zms=array(
		'1'=>'A',
		'2'=>'B',
		'3'=>'C',
		'4'=>'D',
		'5'=>'E',
		'6'=>'F',
		'7'=>'G',
		'8'=>'H',
		'9'=>'I',
		'10'=>'J',
		'11'=>'K',
		'12'=>'L',
		'13'=>'M',
		'14'=>'N',
		'15'=>'O',
		'16'=>'P',
		'17'=>'Q',
		'18'=>'R',
		'19'=>'S',
		'20'=>'T',
		'21'=>'U',
		'22'=>'V',
		'23'=>'W',
		'24'=>'X',
		'25'=>'Y',
		'26'=>'Z'
	);
?>

<!---------------------------------------- 门店分布内容 start ---------------------------------------->
<div class="mdfbbox">
   <div class="fbbt">广西南宁市范围广羽人门店分布地图：</div>
   <div class="gxditu" id="map" style="width:900px; height:365px; border:1px solid #ccc;"></div>
   <div class="fbbt" style="margin-top:30px;">广西南宁市广羽人所有店铺地址：</div>
   
   <div class="fbdzlf" style="width:900px;    border-right: none;"><?php
	foreach($meidanfenbu as $i=>$r){
	$ik++;
	if($nnssvs) $nnssvs.= ',{ title: "'.$r['mingc'].'", point: "'.$r['zuobo'].'", address: "'.$r['dizhi'].'",tel:"'.$r['tel'].'"}';
	else $nnssvs= '{ title: "名称：'.$r['mingc'].'", point: "'.$r['zuobo'].'", address: "'.$r['dizhi'].'",tel:"'.$r['tel'].'"}';
	$lns=explode(',',$r['zuobo']);
	$ln=$lns['0'];
	$la=$lns['1'];
   ?>
		  
		<div onclick="getdddsnew('{$ln}','{$la}','{$r.mingc}','{$r.dizhi}','{$r.tel}');" style="cursor: pointer;float:left;<?php
			if(($i%2)) echo 'width:425px;margin-left: 25px;';
			else echo 'width:448px;    border-right: 1px dashed #ccc;';
			//if($i>2) echo 'margin-top: 15px;';
		?>padding-bottom:15px;">
      <div style="width:100%;" class="dianming"><span style="color:red;"><?php echo $zms[$ik];?></span> {$r.mingc}</div>
      <P style="width:100%;" class="diandizhi" style="margin-bottom:15px;">{$r.dizhi}</P></div>
      <?php
	  }
	  
	  ?>
   </div>
   
  
</div>
<!---------------------------------------- 门店分布内容 end ---------------------------------------->


<script>
	var load = document.createElement("script");  
	load.src = "http://api.map.baidu.com/api?v=1.4&callback=map_init";  
	document.body.appendChild(load); 

var markerArr = [ 
	<?php echo $nnssvs;?>
	//{ title: "名称：金外滩商务大厦", point: "108.33058,22.815521", address: "金外滩商务大厦1301"},
	//{ title: "名称：人民公园", point: "108.336858,22.83404", address: "人民公园地址<br>电话13607875450 "}
];  
  
                //var map; //Map实例  
				//map = new BMap.Map("map"); 
                function map_init() {  
                    map = new BMap.Map("map");
                    //第1步：设置地图中心点，南宁市政府  
                    var point = new BMap.Point(108.33058,22.815521);  
                    //第2步：初始化地图,设置中心点坐标和地图级别。  
                    map.centerAndZoom(point, 13);  
                    //第3步：启用滚轮放大缩小  
                    map.enableScrollWheelZoom(true);  
                    //第4步：向地图中添加缩放控件  
                    var ctrlNav = new window.BMap.NavigationControl({  
                        anchor: BMAP_ANCHOR_TOP_LEFT,  
                        type: BMAP_NAVIGATION_CONTROL_LARGE  
                    });  
                    map.addControl(ctrlNav);  
                    //第5步：向地图中添加缩略图控件  
                    var ctrlOve = new window.BMap.OverviewMapControl({  
                        anchor: BMAP_ANCHOR_BOTTOM_RIGHT,  
                        isOpen: 1  
                    });  
                    map.addControl(ctrlOve);  
  
                    //第6步：向地图中添加比例尺控件  
                    var ctrlSca = new window.BMap.ScaleControl({  
                        anchor: BMAP_ANCHOR_BOTTOM_LEFT  
                    });  
                    map.addControl(ctrlSca);  
  
                    //第7步：绘制点    
                    for (var i = 0; i < markerArr.length; i++) {  
                        var p0 = markerArr[i].point.split(",")[0];  
                        var p1 = markerArr[i].point.split(",")[1];  
                        var maker = addMarker(new window.BMap.Point(p0, p1), i);  // i 标注字母顺序
                        addInfoWindow(maker, markerArr[i], i);   
                    }  
                }  
  
                // 添加标注  
                function addMarker(point, index) {  
                    var myIcon = new BMap.Icon("http://api.map.baidu.com/img/markers.png",  
                        new BMap.Size(23, 25), {  
                            offset: new BMap.Size(10, 25),  
                            imageOffset: new BMap.Size(0, 0 - index * 25)  
                        });  
                    var marker = new BMap.Marker(point, { icon: myIcon });  
                    map.addOverlay(marker);  
                    return marker;  
                }  
  
                // 添加信息窗口  
                function addInfoWindow(marker, poi) {  
					
                    //pop弹窗标题  
                    var title = '<div style="font-weight:bold;color:#CE5521;font-size:14px">' + poi.title + '</div>';  
                    //pop弹窗信息  
                    var html = [];  
					
					html.push('<p style="vertical-align:top;line-height:16px">地址:'+poi.address+'</p><p style="vertical-align:top;line-height:16px">电话:'+poi.tel+'</p>');
                    /*html.push('<table cellspacing="0" style="table-layout:fixed;width:100%;font:12px arial,simsun,sans-serif"><tbody>');  
                    html.push('<tr>');  
                    html.push('<td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">地址:</td>');  
                    html.push('<td style="vertical-align:top;line-height:16px">' + poi.address + ' </td>');
					html.push('</tr><tr><td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">电话:</td>');
					html.push('<td style="vertical-align:top;line-height:16px">' + poi.tel + ' </td>');					
                    html.push('</tr>');  
                    html.push('</tbody></table>');  */
                    var infoWindow = new BMap.InfoWindow(html.join(""), { title: title/*, width: 200*/ });  
  
                    var openInfoWinFun = function () {  
                        marker.openInfoWindow(infoWindow);  
                    };  
                    marker.addEventListener("click", openInfoWinFun);  
                    return openInfoWinFun;  
                }  
  
                //异步调用百度js  
                /*function map_load() {  
                    var load = document.createElement("script");  
                    load.src = "http://api.map.baidu.com/api?v=1.4&callback=map_init";  
                    document.body.appendChild(load);  
                }  
                window.onload = map_load; */ 
				//点击打开标注点移动到标注点地图中心
				function getdddsnew(ln,la,title,address,tel){
				
					//pop弹窗标题  
                    var title = '<div style="font-weight:bold;color:#CE5521;font-size:14px">' + title + '</div>';  
                    //pop弹窗信息  
                    /*var html = [];  
                    html.push('<table cellspacing="0" style="table-layout:fixed;width:100%;font:12px arial,simsun,sans-serif"><tbody>');  
                    html.push('<tr>');  
                    html.push('<td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">地址:</td>');  
                    html.push('<td style="vertical-align:top;line-height:16px">' + address + ' </td>');
					html.push('</tr><tr><td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">电话:</td>');
					html.push('<td style="vertical-align:top;line-height:16px">' + tel + ' </td>');					
                    html.push('</tr>');  
                    html.push('</tbody></table>');*/
					html='<p style="vertical-align:top;line-height:16px">地址:'+address+'</p><p style="vertical-align:top;line-height:16px">电话:'+tel+'</p>';
					
				
					//alert(lnat);
					//map.panTo(new BMap.Point(116.409, 39.918));平滑移动至新中心点 如果移动距离超过了当前地图区域大小，则地图会直跳到该点。
					var Point=new BMap.Point(ln,la);
					var opts = {    
					 //width : 250,     // 信息窗口宽度    
					 //height: 100,     // 信息窗口高度    
					 title : title  // 信息窗口标题   
					}    
					var infoWindow = new BMap.InfoWindow(html, opts);  // 创建信息窗口对象    
					//map.openInfoWindow(infoWindow, map.getCenter());      // 打开信息窗口
					map.openInfoWindow(infoWindow, Point);
				}
				
				//map.panTo(new BMap.Point(116.409, 39.918));
            </script>

Run code

Cut to clipboard

文章：百度地图显示多个标注点发表时间：2016-11-02, 17:49:12

展开↯

#²⁰⁵²

作者：广西南宁市

关于百度地图api标注点marker的click事件问题

百度地图在地图中给标注点marker添加后click事件后

marker.addEventListener("click", function(){})
如何在其他地方自动触发这个marker点击事件？
因为输出marker是一个对象，所以并不能marker.click()
想做的就是如百度地图那样点击左边搜索结果栏右边标注点自动点击一次

Run code

Cut to clipboard

感觉api确实不太好用，想出来俩解决方案。

1.可以定义好事件处理函数，想要触发时执行一遍：

marker.addEventListener('click',func);
function func(){
    alert();
}
// 想要触发时，直接调用func
func();

Run code

Cut to clipboard

2.发现marker有一个属性B指向标记DOM，但B只在地图加载完成后才有值，否则为null，所以可以在地图加载完成后给给B绑定事件.

map.addEventListener("tilesloaded",function(){
    marker.B.addEventListener('click',function(){
        alert();
    });

    /* 使用zepto或jQuery
    $(marker.B).on('click',function(){
        alert();
    });
    */
});

// 注意触发时要保证地图加载完成
marker.B.click();
/* 或
$(marker.B).trigger('click');
*/

Run code

Cut to clipboard

也可以不等地图加载完，定义marker后就直接绑定，但触发时还是触发marker.B也是可以的。

marker.addEventListener('click',function(){
    alert();
});

// 注意触发时要保证地图加载完成
marker.B.click();

Run code

Cut to clipboard

文章：百度地图显示多个标注点发表时间：2016-11-02, 15:44:49

展开↯

Records:2787 108/147 «‹104 105 106 107 108 109 110 111 112 ›»