随笔分类 - [10]JS
-
jQuery Colorbox是一款弹出层
摘要:jQuery Colorbox使用教程jQuery Colorbox是一款弹出层,内容播放插件,效果极佳,最关键的是大小只有10KB,当然我主要是用来弹出图片啦,(之前介绍过jquery Fancybox插件,个人很喜欢)。jQuery Colorbox不仅有弹性动画效果,淡入淡出效果,幻灯片播放,宽度自定义,还能够ajax加载html,iframe等等,最主要的是它还可以写回调函数。废话少说,请看5种演示效果:http://www.phpddt.com/demo/colorbox/example1/http://www.phpddt.com/demo/colorbox/example2/ht 阅读全文
-
Bootstrap 布局
摘要:Bootstrap 3 How-To #3 布局对于 Web 开发来说,一个永远的话题是如何创建一个跨浏览器兼容的布局。许多年来,各种框架使用各种技术来解决这个问题。Bootstrap 使用了一个不同的方式来解决这个问题。基于 960 像素的布局http://960.gs,bootstrap 提供了更为简单的语法,它还支持响应式布局,布局可以根据设备的不同尺寸进行调整,从桌面计算机到平板和手持设备。以前版本的 bootstrap 在没有使用响应式布局的时候,使用了 940px 布局使用 span* 和 offset* 布局。在使用响应式布局的时候,网格系统使用 724px 或者 1170px 阅读全文
-
js调用父框架函数
摘要:if (window.parent && window.parent.frames["frame_main"]) { alert(window.parent.frames["frame_main"]); window.parent.frames["frame_main"]..location.reload(); }else{ window.parent.frames.item("frame_main").location.reload();}if (window.parent && 阅读全文
-
JavaScript原生对象拓展
摘要:JavaScript原生对象拓展在据说每个大牛、小牛都应该有自己的库——框架篇中我扬言要做个小牛,没想到一天没更新,小伙儿伴们就戏谑的问我,油哥是不是要太监了?其实事情是这个样子的,这不是太监的节奏,一是,关于写个自己的库的想法由来已久,但只是周末才下决心要写,本来觉得会有很多以前的总结要写出来的,可是一下笔才知道有多难,零零散散的东西谁都能够写出来,可怎么把这些东西写的有条理、效率高、可用性强之前从来没有想过,二是最近几天和未来的日子公司会比较忙,下班回来的时间有限,没太多时间去想,所以拖沓了,不过不会太监。JavaScript原生对象言归正传要想对JavaScript原生对象进行拓展,首先 阅读全文
-
解决jqplot与jquery-ui导入必要包时的冲突
摘要:解决jqplot与jquery-ui导入必要包时的冲突对于一个网页中,即要有jqplot的画图,又要有jquery-ui的风格显示!但在导入必要的包时,出现了问题!先导入jqplot的必要包:1 2 3 4 5 6 7 8 9 再导入jquery-ui的必要包:1 2 3 4 5 6 这样子的话能有jquery-ui的样式,会画不出图表,想当然就是jquery-ui的必要包会跟jqplot的必要包起冲突,而进行覆盖!如果导入jquery-ui的必要包,再导入jqplot的必要时的顺序的话,这样不能有jquery-ui的样式,但却能画出图来!解决的方法!如下,将必要包进行混合: 1 2... 阅读全文
-
JAVASCRIPT函数定义表达式和函数声明的区别
摘要:JAVASCRIPT函数定义表达式和函数声明的区别在javascript中,函数有两种定义写法,函数定义表达式和函数声明,其例子分别如下所示: var test = function(x){ return x; } function test(x){ return x; } 尽管函数定义表达式和函数声明语句包含相同的函数名,并且都创建了新的函数对象,但是这二者却有区别。 函数声明语句中的函数名是一个变量名,变量指向函数对象。 函数定义表达式和通过var声明变量一样,其函数被提前到了脚本或函数的顶部,因此它在整个脚本和或函数内都是可见的。这样的话,只有函数变量声明提前了... 阅读全文
-
JavaScript怎么上传图片
摘要:JavaScript怎么上传图片在XMLHttpRequest Level2出台之前,大多数的异步上传图片都是利用iframe去实现的。至于具体的实现细节,我就不在这边啰嗦的,Google一下就有文章谈这个东西。这次主要说说,怎么用新的API去实现图片上传。首先,少不了的自然是XMLHttpRequest Level2的一些新特性啦。其中最为实在的就是FormData对象,直接把表单(form)的Dom对象转为FormData对象,然后向服务器发送。还有就是Progress事件的支持,异步上传终于可以查看进度条啦!这里我就不废话了,因为大多数人应该都看过的阮一峰的《XMLHttpRequest 阅读全文
-
Bootstrap 3 How-To #2 标题,链接与按钮
摘要:Bootstrap 3 How-To #2 标题,链接与按钮这个系列的要点来自一本名为Twitter Bootstrap Web Development How-to的书,但是,这本书的内容是基于以前版本的,与最新的 3.0 并不一致。为了方便学习和使用 BootStrap 3, 这里将内容替换为了当前的 3.0 版。原书可以在 Amazon 买到,$17.99. 原书的内容比较简单,我会尽量补充一些内容。如果你很熟悉 HTML,你就可以很快地填充网页的内容,但是,bootstrap 拥有一些需要你注意的特性。开始如果你是一个 HTML 的新手,最好的 HTML 学习和参考的站点是http:/ 阅读全文
-
JavaScript function函数种类介绍
摘要:JavaScript function函数种类介绍本篇主要介绍普通函数、匿名函数、闭包函数1.普通函数介绍1.1 示例?123functionShowName(name) {alert(name);}1.2 Js中同名函数的覆盖在Js中函数是没有重载,定义相同函数名、不同参数签名的函数,后面的函数会覆盖前面的函数。调用时,只会调用后面的函数。?1234567891011varn1 = 1;functionadd(value1) {returnn1 + 1; }alert(add(n1));//调用的是下面的函数,输出:3functionadd(value1, value2) {returnva 阅读全文
-
IceMx.Mvc
摘要:IceMx.Mvc 我的js MVC 框架 开篇开篇这篇文章是后补的,前端时间想写一些对于js开发的一些理解,就直接写了,后来发现很唐突,所以今天在这里补一个开篇。我的js Mvc 框架 基于实用设计,过分设计等于没设计。本着简单的原则,它只实现以下2点。1、html代码、逻辑、数据处理的分离。2、组件化对于现在web页面交互性要求越来越强的情况,开发复杂的js段应用就必不可少。就拿一个评论模块来讲,你可能要求它调用简单、参数可配置、组件化。组件化就不用说了,你肯定不希望你写的代码到处复制了。以前我自己写js组件的时候最原始的办法是把html代码 隐藏在页面里,用的时候show一下后来发现这样 阅读全文
-
HighCharts 图表高度动态调整
摘要:HighCharts 图表高度动态调整前言 在使用HighCharts控件过程中,发现图表可以自适应div的高度,无法根据图表x、y轴的数量动态调整div高度,否则图标挤在一起,看起来非常不美观,也无法达到用户的要求。相关资源 示例代码下载 实现 C#通过SQL语句得到统计结果,使用DataTable来存放数据,则数据格式为x y1 y2 y3 y4 0 10 20 30 401 20 20 40 302 50 50 50 50 3 40 50 30 20... 阅读全文
-
JavaScript—之对象参数的引用传递
摘要:JavaScript—之对象参数的引用传递变量1.JavaScript hoisting>>请看例子,我们拿Chrome的console作为JS的运行环境。上面直接执行console.log(a), 不带一点悬念地抛出了not defined 错误。这是预料之中的。看下面进化后的代码:之前变量没有定义的错误没了,取而代之的是告诉我们a的值是 'undefined'。先不管a的值缘何为 'undefined' 了,至少可以知道现a这个变量是定义了,因为之前报的' a is not defined'的错误没有了。这正是因为JavaScri 阅读全文
-
各种序列化库的性能数据
摘要:各种序列化库的性能数据本文内容来自http://theburningmonk.com/benchmarks/,作者收集了各种序列化库的性能数据,数据仅供参考,作为一个经验法则你应该自己动手针对您的实际数据和用例做测试。1、二进制序列化Serializers TestedBinaryFormatterprotobuf-netv2.0.0.480MsgPackv0.1.4298.15470MessageShark更多信息看这里.2、Json序列化Serial 阅读全文
-
addEventListener和attachEvent以及element.onclick的区别
摘要:addEventListener和attachEvent以及element.onclick的区别attachEvent是ie添加事件处理程序,接收两个参数,其中事件类型名称要加"on",可以添加多个事件处理程序,按照添加顺序相反的顺序触发;addEventListener是给非ie添加事件处理程序,接收三个参数,第一个是事件名,不需要加“on”,第二个是绑定的函数,第三个参数是一个布尔值,是事件的方式,意思是是否使用useCatch方式,如果是false,就使用传统的冒泡方式,如果为true,就在捕获阶段调用事件处理程序。addEventListener可以添加多个事件处理 阅读全文
-
玩下Javascript
摘要:玩下Javascript前言好久没有更新博客了,也蛮少捣弄javascript,今儿看到一个题目,关于给你一个面板,你可以随意的在上面画矩形,可以移动和删除任意一个你创建的矩形,心血来潮搞着玩哈,实现起来挺简单的,但这代码是我怎么看就是觉得不舒服,求指点,同时代码中有更好的实现方式也请提出,感谢!关于这道题目?要求:1.body中仅给出一个div当作面板,在此区域任意位置画矩形2.在画出的任意矩形中可以选中想要的那个,并改变其背景色以区分3.可以控制任意一个矩形的位置,同时不能影响其他矩形4.可以删除任意一个矩形实现遇到问题其实呢很多人看到这个问题,很所人觉得很简单,不就是对dom的操作以及是 阅读全文
-
可拖动的DIV续
摘要:可拖动的DIV续之前写过一篇可拖动的DIV讲如何实现可拖动的元素,最后提出了几点不足,这篇文章主要就是回答着三个问题1. 浏览器兼容性2. 边界检查3. 拖动卡顿、失灵先附上上次代码View Code Test Dialog This is a draggable test. 浏览器兼容性这个是最好解决的问题了,看看上面代码涉及到浏览器兼容性的地方无非就是event获取及事件源获取、事件绑... 阅读全文
-
JS的基本概念
摘要:JS的基本概念任何语言的核心都必然会描述这门语言最基本的工作原理。而描述的内容通常都要涉及这门语言的语法,操作符,数据类型,内置功能等用于构建复杂解决方案的概念。Ecma-262通过叫做EcmaScript的“伪语言”,为我们描述javascript的多有这些基本概念。3.1语法EcmaScript的语法大量借鉴了C语言的语法。因此熟C语言的开发人员在接受ECMAScprit,会有一种轻松的感觉。3.1.1 区分大小写要理解的第一个概念就是ECMAScript中的一切(变量,函数名和操作符)都区分大小写。这就意味着test和TEST分别表示两个不同的变量,而函数名称不能使用typeof,因为是 阅读全文
-
一句命令快速合并 JS、CSS
摘要:一句命令快速合并 JS、CSS 在项目开发环境下,我们会把 JS代码尽可能模块化,方便管理和修改,这就避免不了会出现一个项目自身 JS 文件数量达到 10 个或者更多。 而项目上线后,会要求将所有 JS 文件合并为 1 个或者几个,手动的操作虽然也不是问题,但每次修改更新都要手动操作合并一遍,这就肯定是个噩梦了。 这种情况下,一些工具也就随之产生,比如在线合并,一些网站提供js文件上传,然后合并,但这还是很麻烦,如果开发环境没有网络呢? 这会我就想到了 windows 系统下的 cmd 里的 copy命令,它虽然是个复制的功能,但实则也是可以实现合并文件的需求,下面就看下这句代码:?co... 阅读全文
-
phantomjs初次认识
摘要:phantomjs初次认识最近没什么重要的任务,就抽空看了看项目组爬虫小组的代码,因为我们的爬虫主要是以python的scrapy框架为主,看起来比较方便。在看代码的时候看到一个叫phantomjs的东西,蛮新鲜的,就去问了下爬虫开发,这货是干嘛用的?开发告诉我这个东西是一个js引擎,我们在抓取ajax页面的时候用的,你们QA不是一直用selenium对付那些js渲染的东西么,可以去试试这个,不需要用浏览器的。于是,回去查了一下phantomjs这个东西,学习了下,感觉还是蛮容易上手的。 Phantomjs是一个轻量的浏览器引擎,官网介绍中提到,它主要用在这几个场合:官网地址:http://. 阅读全文
-
Javascript 封装问题
摘要:Javascript 封装问题为什么会用这样一个题目呢,这是要说封装的什么问题,本文并不讲高深的封装理论,只是解决一个小问题。问题来源今天在百度知道上闲逛,遇到一个网友的问题,问题如下,问题的地址见这里:下面先不看看其他网友给的答案:网友大部分回答不能一起定义,那么我们来分析下为什么这样做是错的,然后给出相应的解决办法。重现问题先来说说为什么调用出错,我在自己的浏览器里重现了问题,处于实验并未全部复原代码,并且用到了全局变量哦:function Dialog(){ Dialog.prototype = { init:function(){ co... 阅读全文