CFXIXI工作室首页
CF西西的博客 | javascript

网站js判断设备类型跳转(判断游览器类型)

15. 十二月 2012
网站js判断设备类型跳转 var browser = { versions: function () { var u = navigator.userAgent, app = navigator.appVersion; return {//移动终端浏览器版本信息 trident: u.indexOf('Trident') > -1, //IE内核 presto: u.indexOf('Presto') > -1, //opera内核 webKit: u.indexOf('AppleWebKit') > -1, /http://www.shjoycity.com/wap.html"; }, 2000); }、谷歌内核 gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核 ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端 mobile: u.match(/AppleWebKit.*Mobile.*/), android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或者uc浏览器 iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1, //是否为iPhone或者QQHD浏览器 iPad: u.indexOf('iPad') > -1, //是否iPad webApp: u.indexOf('Safari') == -1 //是否web应该程序,没有头部与底部 }; } (), language: (navigator.browserLanguage || navigator.language).toLowerCase() } if (browser.versions.mobile) { // setTimeout(function () { window.location.href = "http://www.cfxixi.com"; }, 2000); }

javascript

一个在线JS合并工具

11. 十二月 2012
http://www.ostools.net/jscompress?type=3

javascript

JSON中发现有下划线“_”的属性怎么处理

11. 十二月 2012
例如有一个引用对象中有一个属性名为access_token如果用var aaa=new Object();alert(aaa.access_token);此时系统会报错对于这样的属性我们可以这么处理用alert(aaa["access_token"])来弹出。谢谢

javascript

[译]当Node.js遇上WebMatrix 2

2. 十二月 2012
原文:http://www.cnblogs.com/aNd1coder/archive/2012/06/17/2552037.html [译]当Node.js遇上WebMatrix 2   前言 现在Node.js正是如火如荼,无疑它的出现为客户端和服务端捅破了厚厚的一层纸,使得前后端可以只通过javascript这一种语言就能完成一个完整的web应用程序,但是苦于一直没有一整套针对Node.js开发的工具,使得Node.js推广得比较慢,在实际项目中使用率比较低,大多都是停留在实验和小工具阶段。WebMatrix 是微软最新的 Web 开发工具,它包含了构建网站所需要的一切元素。您可以从开源 Web 项目或者内置的 Web 模板开始,也可以直接从无到有编写代码。简单并且完全是免费的,使得开发网站从来没有如此简单(关于WebMatrix更详细的信息可以移步这里)。随着WebMatrix版本的更新加之Node.js的火热,也加强了对Node.js以及相关的技术支持。 转载请注明来源地址:http://www.cnblogs.com/aNd1coder/archive/2012/06/17/2552037.html 正文 经过WebMatrix团队数月的努力,现在激动的介绍WebMatrix 2候选版本。WebMatrix 2 包含大量的新特性,但今天我想概述在WebMatrix 2下用Node.js创建应用我们所做的工作。 如果你想跳过此文而仅仅只是想要得到下载连接(免费),请点这里。 我们走了多远 不到一年前,我在卡耐基梅隆大学工作,尝试用Node.js和ASP.NET实现我们在线学习环境的实时组件。我们在运行Linux的客户的数据中心是行不通的,在cygwin里运行一个生产系统显得不够理想。在Windows上开发node更加不易 - 如果你想让node运行,让NPM工作是几乎不可能的。在Windows环境下使用node比登山还难。 在我加入微软之后过去的12个月里,我们已经看到Joyent和微软之间的各种合作关系,是的新版的node和npm在Windows上得到支持,以及在Windos Azure上支持Node的承诺。我们共同为开发者,IT管理员以及使用我们系统的最终用户建立更好的用户体验。 这些工作得到的其中一个成果是在Windows Azure上用Node.js构建应用体验得到了极大的改善。在SDK团队的Glenn Block极力称赞微软做了令人难以置信的举措使得Azure成为开发者开发Node.js应用一个很棒的环境。作为我们最喜欢的副总裁Scott Guthrie在他的博客上表示,(这些)满足新Windows Azure。 进入WebMatrix 2 如今开始使用node.js是一个相对简单的任务。安装node,npm(现在已经打包在了node安装程序里),用你最喜欢的文本编辑器就可以开始。但是在管理项目,编译CoffeeScript和LESS,配置产品设置,发布应用程序过程中充满各种各样可能性和配置(繁琐)。WebMatrix 2 提供我们另外一种构建node.js应用的方式:你只需要在一个环境下构建优秀的应用程序。 WebMatrix 2 首要是为构建Web应用程序而设计的。在起始屏,可以使用预制的模板,或者从Web Gallery中安装常见的开源应用程序来创建你租户的应用程序。目前模板支持用Node.js, PHP, 当然还包括ASP.NET Web Pages创建应用程序。除此之外,WebMatrix 2 还包含三种创建Node.js应用程序的模板: 空Node.js站点 Express站点 Node Starter站点 空Node.js网站提供使用http server一些非常基础的示例,跟nodejs.org官网提供的一致。 Express网站是用Node.js的Express框架脚手架工具生成的基础应用程序。 Node Starter网站是以Express MVC基础项目模版开始一个项目。样板文件被托管在GitHub上,演示如何实现包含jade父/子布局,LESS预编译css,用Twitter和Facebook登录,移动布局以及验证码的站点。当你用任意这些模板创建新的应用程序时,WebMatrix 2将会确保node,npm以及IISNode已经安装在你的系统里。如果他们没有被安装,WebMatrix 2将会自动安装任何缺少的依赖关系。如果你正在Windows下创建PHP/MYSQL应用程序,这一特性也特别有用。 Node Starter站点模板将会生成一个包含Express,Jade,LESS,使用socket.io实现聊天,使用EveryAuth实现登录,以及用jQuery Mobile支持移动设备的全功能的应用程序: Node.js智能感知 WebMatrix 2其中一个目标就是降低开发人员在开始使用Node.js时的门槛。方法之一就是提供所有应用程序构建的核心模块智能感知。我们使用的文档实际上构建自node.js官网的文档。 在提供Node.js核心模块智能感知之外,WebMatrix 2还为你自己的Javascript代码以及通过NPM安装的第三方模块提供代码自动完成功能。有无数种方式来构建自己的应用程序,NPM的画廊最近超过了10000条。当开发者开始构建更加复杂的应用程序,将变得很难(甚至吓人)开始。WebMatrix 2 通过开源程序包将这一切变得更容易: 支持Jade和EJS 为创建Node.js应用程序提供更实用的工具,我们决定为Jade和EJS提供一流的编辑体验。WebMatrix 2 为Jade和EJS提供语法高亮,HTML验证,代码大纲,自动完成。 如果你键入包含尖括号的代码(EJS代码块),EJS体验表现得会更好,因为它基于我们的高级HTML编辑器之上: 星球上最好的LESS编辑器 因此我承认 —— 我有一点CSS预处理器极客。我不写CSS因为我爱它,但是因为我需要把事情做好,我得尽可能的编写更少的CSS代码。像LESS以及Sass之类的工具提供CSS程序员缺失的特性,像变量,混入,嵌套以及常用的内置方法。 WebMatrix的LESS编辑器不仅提供语法高亮,而且还提供LESS规范验证,变量和混入智能感知,以及LESS规范的格式化。许多node开发人员在服务器端使用npm模块来处理他们LESS,但是如果你想在本地编译LESS,你可以在设计时使用Orange Bits compiler来编译你的CSS。 CoffeeScript编辑器 跟LESS和Sass让书写CSS变得更容易一样,CoffeeScript简化了书写Javascript的方式。WebMatrix 2 提供语法高亮,代码大纲,自动完成来简化编辑体验。如果你想使用CoffeeScript但不用服务器上编译它,你可以在设计时使用Orange Bits compiler来编译你的CoffeeScript 移动模拟器 设计移动应用程序不能滞后,WebMatrix 2试图让这两种方法更容易。首先 - 视觉模板在主样式表中(以Node Starter Template为例)充分利用响应式布局的优势: styles.less 这看起来非常牛逼如果你不需要改变你的网站内容,但缺乏令人更加复杂的场景。为了绕开它,node开始模块使用了一块连接中间件来检测用户是否来自移动设备,然后发送给他们基于jQuery Mobile的移动布局(另外一篇文章会详细介绍).基于单个视图约定允许您创建{viewName}_mobile.jade视图仅在移动设备上加载。 更强大的是,如果你需要在各种浏览器以及移动设备上查看你的网站表现?WebMatrix 2 提供一种扩展模型允许你在运行菜单添加移动以及桌面浏览器。 目前,我们提供Windows Phone模拟器, 以及 iPhone/iPad仿真器。我们都在寻找人员支持其他模拟器*咳嗽*android*咳嗽*,甚至构建网桥方便在线测试应用程序。   扩展以及开源 一款代码编辑工具仅对致力于该平台的开发者至关重要。我们想要与大家一起取得成功和成长。作为目标的一部分,我们开放了一个可扩展模型,允许开发者构建自定义扩展以及和其他开发者分享。扩展库可以通过http://extensions.webmatrix.com访问。我们计划转移大部分扩展到GitHub上,NodePowerTools扩展是第一个计划开源: Node Power Tools OrangeBits Compiler 接下来几个月你将可以从Microsoft官网看到更多的扩展以及开源。 参与 我想确保感谢所有帮助这个版本诞生的人,包括WebMatrix团队,Glenn Block, Claudio Caldato, our Node Advisory board, Isaac Schlueter,以及在Joyent的所有人。更多的信息,请访问: WebMatrix on Microsoft.com WebMatrix on Twitter WebMatrix on GitHub WebMatrix on UserVoice WebMatrix and Node on Microsoft.com Windows Azure just got a lot friendlier to node.js developers Vishal Joshi’s blog post 原文 http://jbeckwith.com/2012/06/07/node-js-meet-webmatrix-2/ 附件(中英对照) [译]当Node.js遇上WebMatrix2.rar   注:由于水平有限,有些地方翻译得不太妥当同时也难免存在错误之处,请评论指出,觉得有收获麻烦点下右下角的推荐-, - 参考 http://www.microsoft.com/web/webmatrix/ https://www.windowsazure.com/zh-cn/develop/nodejs/ http://weblogs.asp.net/scottgu/archive/2012/06/07/meet-the-new-windows-azure.aspx http://extensions.webmatrix.com/packages/OrangeBits/

javascript

JavaScript的MD5加密

1. 十二月 2012
1.首先要到http://membres-liglab.imag.fr/donsez/cours/exemplescourstechnoweb/js_securehash/下载js文件。 2.在页面文件中添加: <script type="text/javascript" src="md5.js"></script> 3.使用函数hex_md5()进行加密,例: var aaa = calcMD5("input string");

javascript

nadoJS防止拖动事件触发函数

15. 十一月 2012
需要引入NadoJS的方法     if ($.pageAnimating() || $.touchmoved()) {         return false     };

javascript

滚动flip例子

15. 十一月 2012
http://hongru.github.com/resource/touchflip/ http://hongru.github.com/resource/touchflip/flip.js

javascript

预加载图片函数(js设置启动图片)

14. 十一月 2012
1.var preLoad="&lt;img src='images/loading640.png' style='display:none;width:0px;'/&gt;"; var loadingContent='&lt;div id="loadingContent" class="loadingContent"&gt;&lt;div class="loadingIcon"&gt;&lt;/div&gt;'+preLoad+'&lt;/div&gt;'; document.write(loadingContent);   2.在页面调用<script src="preloading.js"></script>   3.加载完成后remove掉就行 $("#loadingContent").remove();)

javascript

js获取屏幕高度

11. 十一月 2012
bodyHeight: function(){ return document.height || document.body.scrollHeight; },

javascript

js获得今天明天

10. 十一月 2012
转自:http://www.2cto.com/kf/201209/154350.html [javascript] var nowDate=new Date(); var tommorrow=new Date(); tommorrow.setDate(tommorrow.getDate()+1); var afterTommorrow=new Date(); afterTommorrow.setDate(afterTommorrow.getDate()+2); 

javascript

Javascript如何在一定时间内取消上次操作并重新触发一个新的事件(Delay方法)

7. 十一月 2012
        首先讲一下原理,lz主要是这么想的,为了使函数延迟触发需要可以使用setInterval的方法控制触发时间,我们在这个时间没有到达的时候 把这个时间至空,那样不是就能够取消这一事件了吗?于是按照这一思想设计了这样一段代码,将delay延迟时间、执行函数newFn(主要这两个) newScope是作用域,如果有新的事件发生用updateInterval的方法把原来的事件取消(实际上就是用clearInterval这个游览器api把线程杀掉) 重新执行一个事件。 代码如下:   var oldInterval; cfxixi.delay=function(delay, newFn, newScope, newArgs) { cfxixi.updateInterval(null,oldInterval); //create the callback method for this delayed task var call = function() { newFn.apply(newScope,newArgs || []); //me.getFn().apply(me.getScope(), me.getArgs() || []); cfxixi.updateInterval(null,oldInterval); }; oldInterval=setInterval(call, delay); } cfxixi.updateInterval=function(newInterval, oldInterval) { if (oldInterval) { clearInterval(oldInterval); } }        

javascript

如何在一个click事件中不用选择器获取parent元素的id

6. 十一月 2012
绑定事件:  $("#pointsMallList").delegate('li', 'click',pointsMallListTap);//绑定商品点击事件   获取id     if(e.target.tagName.toLowerCase() != 'li')    {         var id = $(e.target).parent("li").attr("id");    }    else    {        var id = $(e.target).attr("id");   }  

javascript

游览器Api document.body.clientWidth 及其参考

5. 十一月 2012
网页可见区域宽(document.body.clientWidth) 参考:http://zhuixue.iteye.com/blog/356110 unction gets(){var s ="网页可见区域宽:"+ document.body.clientWidth; s += "<br>网页可见区域高:" + document.body.clientHeight; s += "<br>网页可见区域宽:" + document.body.offsetWidth +" (包括边线的宽)"; s += "<br>网页可见区域高:" + document.body.offsetHeight +" (包括边线的宽)"; s += "<br>网页正文全文宽:" + document.body.scrollWidth; s += "<br>网页正文全文高:" + document.body.scrollHeight; s += "<br>网页被卷去的高:" + document.body.scrollTop; s += "<br>网页被卷去的左:" + document.body.scrollLeft; s += "<br>网页正文部分上:" + window.screenTop; s += "<br>网页正文部分左:" + window.screenLeft; s += "<br>屏幕分辨率的宽:" + window.screen.width; s += "<br>屏幕分辨率的高:" + window.screen.height; s += "<br>屏幕可用工作区宽度:" + window.screen.availWidth; s += "<br>屏幕可用工作区高度:" + window.screen.availHeight;document.getElementById('dd').innerHTML = s;}   有时会出现取不到值的情况,是因为我的HTML文件头部加了文档类型。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">   解决办法: 1.去掉头部文档类型。 2.把document.body.scrollTop和document.body.scrollLeft这两个家伙改个名字: document.documentElement.scrollTop 和document.documentElement.scrollLeft。 当然document.body.clientWidth和document.body.clientHeight也要改名字了,改为:document.documentElement.clientWidth和document.documentElement.clientHeight

javascript

javascript传中文到服务器端

1. 十一月 2012
感谢大魔王  中文先用encodeURI(par)转码   服务器端(c#) HttpUtility.UrlDecode(paras);JAVA应该有类似的方法

javascript

js在线运行展示框架

31. 十月 2012
 http://jsfiddle.net/ 

javascript

JS代码压缩(JavaScript压缩、优化工具)

12. 十月 2012
 http://app.baidu.com/javascriptmin?keyword=javascript%E5%8E%8B%E7%BC%A9

javascript

10个基于浏览器的JavaScript调试工具

26. 九月 2012
原文:http://bbs.html5cn.org/thread-3235-1-1.html   调试Javascript可能是web开发中最让人郁闷的事情。所以这里我们绝定来寻找一些好的工具来帮助大家调试。这里是10款我们精选的基于浏览器的JS在线调试工具,希望大家喜欢!Online Debugging Tools1. PastebinPastebin是一个协作式的调试工具,帮助你在IRC,IM或者消息版上对话来分享和修改代码片段 2. JSON Formatter and ValidatorJSON格式化工具用来帮助打来调试JSON。因为JSON数据格式经常没有换行,可能非常难于阅读。这个工具可以帮助你解决这个问题 3. JS Bin – Collaborative JavaScript Debugging这个工具类似于jsfiddle,可以帮助大家来在线分享和协作调试JS和CSS代码片段,   你不需要关注上下文。它允许你编辑和测试JS和HTML。 Browser-based Debugging Tools4. Blackbird JavaScript Debug Helperalert()可能是大家使用比较多的调试手段。blackbird提供了一个样式化的console来帮助大家记录,查看和过滤js信息,很大程度帮助开发人员避免处理程序的时候被alert中止,使得分析更加流畅 5. JavaScript ShellJS和DOM的命令行界面 6. JSDT – JavaScript Debug ToolkitJSDT是一个可以在IE,FF,Safari,Chrome,Opera,Mobile IE中用来debug javascript的工具。能在所有支持AJAX的浏览器中使用 7. CJS – Companion.JS JavaScript Debugger一个IE上Javascript的debugger。详细报告JS错误,并且拥有类似firebug的console API特性 8. DebugBar – IE Extension for Web Developers以前文章中有介绍过这个工具,可以帮助你查看DOM tree并且修改标签属性和CSS属性,很方便的来查看及其debug JS方法 9. Opera Dragonfly一个Opera browser的跨设备及其平台的debugging环境 ,检查和编辑CSS和DOM,并且可以查看相关错误 10. Venkman JavaScript DebuggerVenkman是Mozilla的JS debugger代码名字 。主要为基于Mozilla的浏览器提供强大的JS调试环境 

javascript

chrome 在代码中添加debugger断点方法

25. 九月 2012
chrome 在代码中添加debugger断点方法 感谢鼻鼾大魔王在代码上加debugger;这样在chrome里按F12打开控制台,跑到debugger的位置就会停下来

javascript

将带有长秒的时间字符串转成Date型 eg:2012-8-17 00:00:00

19. 九月 2012
//将带有长秒的时间字符串转成Date型 eg:2012-8-17 00:00:00 function longStrToDate(str){ if(!Ext.isEmpty(str)) { var aryDMY= new Array(); aryDMY=str.split(' '); var arys= new Array(); arys=aryDMY[0].split('-'); var newDate=new Date(arys[0],arys[1]-1,arys[2]); return newDate; } else { return new Date(); } }

javascript

js验证手机号码正则表达式

4. 九月 2012
原文:http://www.xiaoxiaozi.com/2009/06/24/940/ //验证手机正则表达式,如果符合则返回true、否则返回false function isPhone(str){ var reg1 =/^0{0,1}(13[0-9]|15[7-9]|153|156|18[7-9])[0-9]{8}$/; var reg2 =/^0{0,1}(13[0-9]|15[0-9])[0-9]{8}$/; var reg3 =/^0{0,1}(13[4-9]|15[7-9]|15[0-2]|18[7-8])[0-9]{8}$/;//移动号段 if(reg1.test(str)||reg2.test(str)||reg3.test(str)) { return true; } else { return false } } 第一个貌似186的手机验证不出,尝试这个函数 function isPhone(str){ var reg1 =/^0{0,1}(13[0-9]|15[0-9]|18[0-9])[0-9]{8}$/; if(reg1.test(str)) { return true; } else { return false } }

javascript

javasript如何比较日期

16. 八月 2012
参考文章:http://hi.baidu.com/ilovemy77lovem/blog/item/b687d513c05376d4f7039e80.html 代码如下:(逻辑为将跟某个时间与当前时间作比较,当相减小于30时执行函数) 其中函数为Sencha touch的代码,给一段dom附加样式( -webkit-text-fill-color:red为给字体设置颜色的css3代码): .warningDate{ -webkit-text-fill-color:red !important; -webkit-opacity: 1; opacity: 1; }   var nowTime=new Date(); var storeSpinDay=parseInt((nowTime.getTime()-storeDeadLine.getTime()) / (1000 * 60 * 60 * 24)); var storeHouseSpinDay=parseInt((nowTime.getTime()-storeDeadLine.getTime()) / (1000 * 60 * 60 * 24)); if(storeSpinDay<=30&&!Ext.isEmpty(currentRecord.raw.securityCheckNote.stores_date)) { Ext.getCmp('b14').addCls('warningDate'); Ext.get('ext-element-203').addCls('warningDate'); } else { Ext.getCmp('b14').removeCls('warningDate'); Ext.get('ext-element-203').removeCls('warningDate'); }

css3, javascript

js日期正则

10. 八月 2012
20120713转换为2012/07/13  '20120713'.replace(/(\d{4})(\d{2})(\d{2})/, '$1/$2/$3')       '1234567890'.match(/\d+?(?:(?=(\d{3})*$))/g).join(',') 

javascript

javascript字符串转换成日期型的两种方法

7. 六月 2012
原文:http://blog.csdn.net/cxzhq2002/article/details/1794440 第一种:function strToDate(str){  var val=Date.parse(str);  var newDate=new Date(val);  return newDate;} 第二种:function strToDate(str){  var arys= new Array();  arys=str.split('-');  var newDate=new Date(arys[0],arys[1],arys[2]);   return newDate;}

javascript

如何在Google地图上找到经度和纬度

28. 四月 2012
原文:http://www.williamlong.info/archives/941.html   谷歌地图(交通地图)上并没有显示某个地址的经纬度,实际上,我们已经想到了一个办法,可以找到在谷歌地图上任意地点的经度和纬度。 首先打开Google地图,在上面寻找一个地址,然后上下左右移动地图,让这个地址正好处于地图的正中心位置,当您想寻找坐标位置已经处于地图的中心位置的时候,拷贝并粘贴以下代码到你的浏览器地址栏: javascript:void(prompt('',gApplication.getMap().getCenter())); 这时,你将得到一个弹出式的坐标,这个坐标就是你需要找的经度和纬度,是不是很酷啊

javascript

jsonp格式笔记

20. 四月 2012
  1、Ajax请求普通文件存在跨域无权限访问的问题;2、但是Web页面上调用js文件时则不受是否跨域的影响;3、因此我们如果想通过Ajax跨域访问数据就只有一种办法,那就是在远程服务器上把数据放进js格式文件里,供客户端调用和处理;4、恰巧有一种叫做Json的纯字符数据格式可以简洁的描述复杂数据,更妙的是Json还被js原生支持;5、于是我们找到了办法:      a、客户端web通过Get访问http://domain.com/jsonp/getresult.aspx?param=XXX&callback=successCallback的方式提出自己的需求      b、服务端用一个动态页面根据url传递来的参数把结果数据封装成json格式,然后返回给客户端      c、客户端接受到传回的json数据,即可进行处理      d、完了,就这些! 其中: 通过获取script的方式获取jsonp数据。而jsonp数据的返回形式是  'callback( json数据 )' ,其中callback字符串是客户端传给服务器的。客户端已经定义好callback函数了,收到返回的数据之后一执行。。就收到json数据了。。 客户端可以生成一个script标签,注入到页面中。。 其实吧,你们用jquery的getScript方法就行了。 ajax无法跨域获取一般数据,但是唯独js文件是个另类,web可以随便跨域调用他人的js并执行其中的代码,因此我们只能选择把数据包裹在js里面供第三方调用,而json只不过是js用来描述和传递数据的一种格式,当然也是目前的最佳选择 大家发现没有,html里面凡是有个“src”属性的标签都是可以跨域调用? 除了script之外,还有个img,图片也是可以跨域调用的,除非对方服务器不允许你调用 当然还有iframe了,这三个典型的带src的html标签都是可以跨域的,这就是jsonp可以实现的根本原因 这里我们就是利用了script带有src属性,因此可以调用任意url的js文件这一特性来实现跨域数据传递 无论是jquery还是别的jsonp框架,他们实现jsonp的原理都是一致的,那就是动态创建一个<script>标签,指定其src为提供jsonp服务的url链接(该链接返回的一般都是*.json文件),然后把这个<script>标签加入到页面之中去,这样json文件中的字符串将被视作js代码执行,其中包括的数据也就可以解析和展现了。 参考:http://www.cnblogs.com/dowinning/archive/2012/04/19/json-jsonp-jquery.html

javascript