看了看php,写了个简单的表单验证和保留表单值的demo。页面中单选框和下拉框的选中用js来做了,避免了在php中每个选项都要写语句判断的“不优雅”的情况。
在前台无法查看到php的源代码,比起js,这点让我很有安全感。但是php对前台页面的处理能力比较弱,这时候最好还是用js。
看了看php,写了个简单的表单验证和保留表单值的demo。页面中单选框和下拉框的选中用js来做了,避免了在php中每个选项都要写语句判断的“不优雅”的情况。
在前台无法查看到php的源代码,比起js,这点让我很有安全感。但是php对前台页面的处理能力比较弱,这时候最好还是用js。
有时候我们想要显示图片的缩略图,在七牛中有现成的格式可用调用。假如有下面一个图片的url:
/f/%E8%8A%B1%E5%AB%81Saber2.jpg
我们可以在后面以如下格式对尺寸加以限制:
?imageView2/1/w/<Width>/h/<Height>
本文中的图片url如下:
/f/%E8%8A%B1%E5%AB%81Saber2.jpg?imageView2/1/w/350/h/500
好吧,其实是几天没发文章了,水一发。
一年多前本站的图片都是放在七牛上的。很快免费流量(10G)不够用了,开始每月贴钱。当时自己的理念也有问题,很多游戏CG、画师图集什么的,我全都发在文章里了,一篇文章可能有一两百张图片。最早期的时候很多大图我连尺寸都不带修改的。任性,怎么爽怎么来,现在知道自己毕竟还是图样。
几个月前注册了个七牛小号,新的图片全部存在小号上。随着图片越来越多,现在也是每月负债。七牛现在要求实名认证,所以注册更多小号已不可行(我身份证给小号认证了,大号由于注册时间早所以不需要认证)。又拍云又麻烦,这两天看到了阿里的顽兔多媒体服务,使用淘宝账户登陆,免费存储量/月流量都是20G,比七牛大方些(但操作体验比不上七牛)。未认证用户只能上传图片,在支付宝实名认证之后可以上传其他类型的文件了。这一段用用看吧。
顽兔有个活动,在去年12月31日前完成实名认证,自动升级为VIP用户,免费存储量/月流量提高到100G……可惜那时候我还没听说过顽兔。
最近一月,七牛大号流量170G,小号流量30G。而我现在每天最多300IP,只能说是图多惹的祸了。
ps:现在每天访问量最多的一篇文章是女装山脉的CG图,有247张图,分成了四页。想了想决定只留下第一页。文章里分享了CG的115网盘礼包,但是据说现在115只有会员才能接收礼包,这个我爱莫能助了。
我想用js检查网站地图文件里的网址是否都正确,于是找了js判断url是否能够访问的方法。原理是利用jQuery的ajax方法,根据网页状态码来判断网页能否打开。
//判断一个url是否可以访问 function IsLoad(_url){ $.ajax({ url:_url, type:"get", success:function(){ //说明请求的url存在,并且可以访问 console.log('请求的url可以访问'); }, statusCode:{ 404:function(){ //说明请求的url不存在 console.log('请求的url不可访问'); } } }); } //调用 IsLoad("http://www.saber.love/music/");
下面代码是把js操作cookie的步骤封装成了函数,可以方便的调用。
//设置cookie,key,value,整数天数(自然天) function setCookie(name, value,days) { var exp = new Date(); exp.setTime(exp.getTime() + days * 24 * 60 * 60 * 1000); document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString()+ ";path=/"; } setCookie("volume",0.5,365); //其实这里面少了个domain参数,有时候会需要,如最后部分为 ";domain=.ikanman.com;path=/" //读取cookie function getCookie(name) { var arr = document.cookie.match(new RegExp("(^| )" + name + "=([^;]*)(;|$)")); if (arr != null) return unescape(arr[2]); return null; } getCookie("volume");
不过这个函数在设置cookie时没有做对域名的设置。
我们知道WordPress的后台会加载谷歌字体库,在未翻墙情况下,可能会导致这部分内容无法加载从而拖慢整个后台的速度。所以国内很多站长都会装一些插件,用国内的字体库替换掉谷歌字体库。我也装了这么个插件,用的是360字体库。
但是刚才后台打开非常缓慢,几分钟了都一直在转圈,我用chrome的审查工具看了下,有个链接无法访问导致了这个问题:
https://fonts.useso.com/css?family=Open+Sans%3A300italic%2C400italic%2C600italic%2C300%2C400%2C600&subset=latin%2Clatin-ext&ver=4.4
360字体库的访问出了问题了。打开这个网址,浏览器状态栏会提示“正在建立安全连接”,一直打不开。只好到插件文件夹里直接删除了360的这个插件,后台恢复正常。
这个html5音乐播放器是我花了一天时间琢磨出来的,因为好歹做了个像样的界面,所以版本姑且就叫1.0了。
使用了cookie来记住播放的音乐、音量和循环模式。没有做后台功能,例如评分、喜欢等。
使用网易云音乐的歌单做歌曲列表。
另外,音乐的缓冲进度条可能加载到中途就停止了,这个浏览器的行为,和本播放器无关。chrome经常会这样,火狐则是一口气加载完。如果有需要的话,浏览器会继续加载。
Read More →
这是昨天圣诞的时候,本站播放背景音乐《ホーリーナイト》的代码:
<div id="MerryChristmasMusicCtrl" date-playCtrl="pause"></div> <style> #MerryChristmasMusicCtrl{width:25px;height:118px;text-align:center;font-size:14px;font-family:微软雅黑;position: fixed;z-index: 9999;background:#444;color:#fff;cursor: pointer;right:0;top:30%;border-radius: 4px;border:1px solid #000; display: none;} </style> <script> var MerryChristmasMusic=document.createElement("audio"); MerryChristmasMusic.src="http://m2.music.126.net/RLgypZOeXF0W2HEUIA0Wpg==/5959353022986536.mp3"; MerryChristmasMusic.loop="loop"; MerryChristmasMusic.play(); $("#MerryChristmasMusicCtrl").show(); $("#MerryChristmasMusicCtrl").html("暂停播放音乐"); $("#MerryChristmasMusicCtrl").click(function () { if ($("#MerryChristmasMusicCtrl").attr("date-playCtrl")=="pause") { MerryChristmasMusic.pause(); $("#MerryChristmasMusicCtrl").html("继续播放音乐"); $("#MerryChristmasMusicCtrl").attr("date-playCtrl","play"); }else{ MerryChristmasMusic.play(); $("#MerryChristmasMusicCtrl").html("暂停播放音乐"); $("#MerryChristmasMusicCtrl").attr("date-playCtrl","pause"); }; }); </script>
请无视蛋疼的超长变量名……
这两天打算写个音乐播放器出来,看能不能完成吧。
p站会员过期了,无法直接按收藏数搜索了。普通用户看到的作品貌似是按时间排序的,这里面质量参差不齐,为了快速筛选高素质的作品,搞了下面这个小玩意,可以把收藏数低于指定标准的作品从页面中删除:
var wantNum=100; var allPicArea=$(".autopagerize_page_element .image-item"); for (var i = 0; i <allPicArea.length; i++) { if (allPicArea.eq(i).find("._ui-tooltip").length==0||allPicArea.eq(i).find("._ui-tooltip").eq(0).text()<wantNum) { allPicArea.eq(i).remove(); }; };
直接在控制台执行就可以,这个100用的时候自己改吧。
虽然使用了jQuery,但p站页面引用的有,我们不用自己再引用了。
ps:写的时候犯了低级错误,应该用find()的,用成了children(),还是用的太少了。
JavaScript中的document.referrer属性保存了来源网页,也就是当前页面是从哪个网址跳转或打开的。如果想要去除document.referrer信息,有两种办法:
1.对于支持html5特性的浏览器,直接在超链接上加上的属性:
<a href="index.php" rel=noreferrer>测试</a>
这样,在跳转后的页面中查看属性,值为空。
2.对于不支持html5的浏览器,例如IE8,也先加上rel=noreferrer属性,然后使用JavaScript代码来去除:
<a href="index.php" rel=noreferrer>测试</a> <script src="https://code.jquery.com/jquery-1.8.0.min.js"></script> <script> $.browser.webkit || $.event.add(window, "load", function () { //webkit系列浏览器啥也不做 //把所有带有rel=noreferrer的链接找出来变量处理 $("a[href][rel~=noreferrer], area[href][rel~=noreferrer]").each(function () { var b, e, c, g, d, f, h; b = this; //b表示当前链接dom对象 c = b.href; //保存原始链接 $.browser.opera ? (b.href = "http://www.google.com/url?q=" + encodeURIComponent(c), b.title || (b.title = "Go to " + c)) : (d = !1, g = function () { //Opera做了些啥暂不管 b.href = "javascript:void(0)" }, f = function () { b.href = c }, $(b).bind("mouseout mouseover focus blur", f).mousedown(function (a) { //鼠标out over focus blue都把链接还原 a.which === 2 && (d = !0) //鼠标down时,且鼠标中间按下时,把标志d设成true }).blur(function () { //blur把标志d设成false d = !1 }).mouseup(function (a) { if (!(a.which === 2 && d)) return !0; g(); d = !1; setTimeout(function () { alert("Middle clicking on this link is disabled to keep the browser from sending a referrer."); f() }, 500); return !1 }), e = "<html><head><meta http-equiv='Refresh' content='0; URL=" + $("<p/>").text(c).html() + "' /></head><body>< /body></html>", $.browser.msie ? $(b).click(function () { //e是一个0秒自动刷新的页面,指向原始链接,但是没搞懂为什么搞个p标签在这里?? var a; //如果是IE的话 switch (a = this.target || "_self") { case "_self": case window.name: a = window; break; default: //如果原始链接的目标是本窗口,则在本窗口操作 a = window.open(null, a) //如果原始链接的目标不是本窗口,则用js open一个空窗口 } a = a.document; a.clear(); //清除窗口的document a.write(e); //写入上面构造的0秒自动刷新的页面 a.close(); //关闭文档使其展示出来 return !1 //如果非IE(firefox), 是用的'Data URI scheme'承载0秒自动刷新的页面 }) : (h = "data:text/html;charset=utf-8," + encodeURIComponent(e), $(b).click(function () { //最后js触发点击 this.href = h; return !0 }))) }) }) </script>
这样,跳转后的网页查看rel=noreferrer属性也是空的。
需要注意的是,由于使用了$.browser,所以jQuery版本不能高于1.9。