随笔分类 - [10]JS
-
JSONP的小实验与总结
摘要:一次关于JSONP的小实验与总结前言: 今天,无意间看到自己某个文件夹下有个JSONP的东西。慢慢回忆起,这个东西是之前想写的一个demo,也不知道是多久以前了,但是不知道怎么的,给忘那边了。那么,就趁这个机会把它完成吧,其实也说不上是一个demo,就是一个小实验,虽然,网上也已经有很多关于JSONP的文章和例子了,但是有些东西看看很简单,不亲自试一下总觉得不踏实。我今天为什么要实验,一方面也是经常在网上看到有些网站需要跨域获得数据,但是目前自己做的项目中又没有相关需求,于是很好奇,于是就有了这篇文章,于是......那就开始这次练习吧。一 什么是JSONP JSONP全称:JSON wit. 阅读全文
-
jquery+css实现简单的评分功能
摘要:今天研究了下简单的评分功能,参考了下"http://www.lanxyou.info/star-rating-new-method/",感觉比较简单易用,之后自己做了下优化处理。先看下效果图:原理:橙色星宽度/父容器宽度 * 100 = 分值功能:鼠标悬浮时,其左侧星星点亮 鼠标滑过时,其左侧星星点亮 鼠标点击时,其左侧星星点亮 鼠标移开后,默认记忆上次点击的橙色星宽度所需图片:实现源码:<!doctype html><html><head><meta charset="utf-8"><script 阅读全文
-
Knockot JS 数字输入插件
摘要:我将它放在了在GitHub上面,希望有高手一起来帮助完善它,这里附上网址:?https://github.com/dragonrhyme/KnockotNumeric 之前写过XML技术在界面生成中的简单应用的文章,后来由于一直很忙,就没有再写。但是东西已经可以用了, 附上截图给大家预览下,等自己不那么紧张的时候,再接着跟大家分享,这里先行道歉!再附上一TabPanel为例子的XML代码:1 <Tab ID="tab1" Cols="12" Offset="0">2 <TabItem Key="tabite 阅读全文
-
《Ext JS 4 First Look》翻译之一:新特性
摘要:第一章 新特性 Extjs 4相对于之前的版本作出了重大的修正。其中包括全新的类系统、新平台的引入、API的修整和加强还有新组件的引入(如新的图表和图形组件)。Extjs 4提供更快速、更稳定的用户体验,并且让开发人员更容易上手。在本章我们将学习到下列内容: 1.1. 入手Extjs 4 1.1.1. 包和命名空间的改进 1.1.2. API文档的使用(日后经常和它打交道) 1.2.Extjs新平台的架构 1.3.Extjs 4的类系统 1.3.1. 类定义与对象实例化 1.3.2 继承 1.3.3 组合属性... 阅读全文
-
Ajax用户名验证、服务条款加载、验证码生成
摘要:Ajax(asynchronousjavascriptandxml)异步的javascript和xml.是为了解决传统的web应用中"发送请求-等待响应"这种模式的弊端,(浏览器在发送完请求后,只能等待服务器的响应,用户不能做其他的操作,浏览器发送完请求,会抛弃整个页面,等待服务器返回新的页面,也就是说,浏览器和服务器之间交互的数据量很大,不能做到按需获取数据)而创建的技术,该技术的本质是:通过一个浏览器内置的一个对象(XmlHttpRequest)异步地向服务器发送请求.所谓异步指的是浏览器并没有抛弃整个页面,也就是不是通过表单提交的方式向服务器发送数据,服务器在处理完请 阅读全文
-
前端大牛 Addy Osmani 的15个精彩PPT
摘要:这篇文章收集了Google 前端工程师Addy Osmani 分享在Speaker Deck 的15个精彩幻灯片,每个都是精华中的精华,真正的干货!相信你认真阅读之后一定会有收获!您可能感兴趣的相关文章经典的白富美型 jQuery 图片轮播插件2012年最佳 Web 前端开发工具和框架让人爱不释手的13套精美网页图标素材10套精美的免费网站后台管理系统模板精心挑选的优秀 jQuery Ajax 分页插件 Addy Osmani 创建了 TodoMVC、jQuery UI Bootstrap、jQuery Plugin Patterns 和 Backbone Paginator,出版了《Lea. 阅读全文
-
优秀的 jQuery 文本输入框自动完成 & 自动提示插件
摘要:文框输入框的自动完成和自动提示功能可以帮助用户快速的完成操作,是非常好的产品使用体验。这里向大家推荐一款优秀的 jQuery 文本输入框自动完成 & 自动提示插件,帮助你在网站中轻松添加输入框的自动完成和自动提示功能。您可能感兴趣的相关文章12款很棒的浏览器兼容性测试工具推荐10套精美的免费网站后台管理系统模板开发者必备的8个最佳云端集成开发环境十款精心挑选的在线CSS3代码生成工具推荐8款优秀的免费 Web 安全测试工具 在这篇文章中,我们使用jQuery实现智能输入框光标的位置。它不需要图像,是使用纯粹的CSS3实现的,而且实时、准确,这意味着你在添加或删除文本的时候它会自动适应。 阅读全文
-
JavaScript 项目构建工具 Grunt 实践:任务和指令
摘要:Grunt是一个基于任务的JavaScript项目命令行构建工具,运行于 Node.js 平台。Grunt能够从模板快速创建项目,合并、压缩和校验 CSS & JS 文件,运行单元测试以及运行静态服务器。上一篇文章《JavaScript 项目构建工具 Grunt 实践:安装和创建项目框架》介绍了Grunt 安装和创建项目框架步骤,这篇文章介绍 Grunt 中的任务和指令。Grunt 任务 Grunt 内置下面六种基本的任务:✓ init - 从模板生成项目框架✓ concat - 合并文件✓ lint - 使用JSHint校验代码✓ min - 使用UglifyJS压缩代码✓ quin 阅读全文
-
使用JavaScript建立一个语法高亮输入框
摘要:textarea元素已被广泛用于网页Web的IDE。通常网站自带的textarea编辑器不能满足我们的需求,作为一名开发者我们经常需要进行代码的在线编辑,高亮显示代码等,因此,通过其他的开源项目,我们可以添加一些实用的功能, 在这篇文章中,我将使用JavaScript库ACE来创建一个输入框效果。这是一个完全开源的脚本。该脚本允许开发人员创建支持语法高亮的输入框。然后你可以代码嵌入到网站中的任何地方下载库 首先我们需要Github上下载ACE代码。 下载完成后解压缩,在你的header部分引入js文件 <script src="src-min/ace.js" type 阅读全文
-
那些帮助你成为优秀前端工程师的讲座——《JavaScript篇》
摘要:这篇文章是前端优秀讲座和讨论列表系列连载第三篇,分享JavaScript开发和编码技巧以及构建大规模Web应用程序的经验。前端领域发展迅速,只有时刻掌握前端发展趋势和技术动态,学习前沿的开发思想和理念才能让自己跟上时代的步伐,保持自己的技术优势。您可能感兴趣的相关文章期待已久的2012年最佳 jQuery 插件揭晓10个拥有丰富UI组件的 JavaScript 框架12个效果精美的 JavaScript 倒计时脚本8个非常炫的 HTML5 和 JavaScript 特效12款经典白富美型 jQuery 图片轮播插件《重新思考应用的架构》Re-Imagining the Browser Wit. 阅读全文
-
jQuery的页面加载事件
摘要:作为刚实习半年的菜鸟来说,一直以来都觉得在五花八门的软件行业必须要有自己的立场,我一直坚持将一门语言学精,同时注重算法内功,内外兼修,方可修成正果。最近项目做完闲来无事,想到做项目的时候JS用的多但是自己不是很会用,于是网上买了本一千多页都书,每天花将近16个小时来看它。虽然之前有过Java和.net的基础,但我觉得,从头开始学,注重细节,才能将其学好。 看书的同时,也在网上找Jquery的资料,个人觉得jQuery不仅是一个很好的框架,同时也是一个做的很好的JS项目,通过参考其源码,不仅可以加深对JS的理解,同时也可以学习jQuery。两得,岂不是很爽。 昨天书上看到jQuery的页面加.. 阅读全文
-
JavaScript 项目构建工具 Grunt 实践:安装和创建项目框架
摘要:JavaScript 项目构建工具 Grunt 实践:安装和创建项目框架 Grunt是一个基于任务的JavaScript项目命令行构建工具,运行于 Node.js 平台。Grunt 能够从模板快速创建项目,合并、压缩和校验 CSS & JS 文件,运行单元测试以及启动静态服务器。 安装 Grunt 推荐 Windows 用户使用 Git Shell 来进行命令行操作。安装 Windows 桌面版 GitHub 的时候会自动安装 Git Shell。 GitHub for Windows下载地址:http://windows.github.com Grunt 运行于 Node.js 环. 阅读全文
-
Javascript MVVM模式前端框架—Knockout 2.1.0系列:目录
摘要:Javascript MVVM模式前端框架—Knockout 2.1.0系列:目录2012-05-16 23:41 by 刺客之家, 5094 阅读,22评论,收藏,编辑前言最近一段时间抽空学习了一下Knockout.js,发现这个框架十分有趣:它提供了一种优雅的解决方案来实现UI元素与Javascript对象之间的绑定能够实现双向绑定:UI元素变化的时候更新js对象,反之亦然能够跟踪依赖(dependency tracking),就是对象之间存在依赖的情况下,依赖项的变化会传导到整个依赖链条的末端。灵活的模板功能可以这么理解,基本上这是一个在web浏览器中实现类似Silverlight,WP 阅读全文
-
THREE.JS 你应当知道的十件事
摘要:译序Three.js是一个伟大的开源WebGL库,WebGL允许JavaScript操作GPU,在浏览器端实现真正意义的3D。但是目前这项技术还处在发展阶段,资料极为匮乏,爱好者学习基本要通过Demo源码和Three.js本身的源码来学习。国外网站aerotwist.com有六篇较为简单的入门教程,我尝试着将其翻译过来,与大家分享。0.简介嗨,这是我的第一篇关于如何写出好的代码的文章。和很多开发者一样,我通过实践学习,但同时我也向其他更有经验的开发者们学习。在过去的几个月中,我在canvas标签上花了很多时间,我想如果把这段时间学到的关于WebGL和JavaScript的小技巧都写下来,一定很 阅读全文
-
Javascript MVVM模式前端框架—Knockout 2.1.0系列(9):内建绑定之——Click绑定
摘要:Javascript MVVM模式前端框架—Knockout 2.1.0系列(9):内建绑定之——Click绑定2013-01-24 09:19 by 刺客之家, 140 阅读,2评论,收藏,编辑*本文已经同步至索引目录:http://www.cnblogs.com/wbpmrck/archive/2012/05/16/Knockout-introduction.html前言&基础惯例吐槽几句先。最近快过年了,手头上的事情才稍微少了点,终于有时间继续整理以前的学习记录,分享给大家。PS:最近花了点时间看了一下其他一些前端框架比如backbone.js,angularJS,发现knock 阅读全文
-
jQuery ajax —— Baidu ajax
摘要:你没有看错标题,本文的确是在讲Baidu ajax,不过是很久很久以前的版本了。由于jQuery ajax模块有800+行,而核心函数jQuery.ajax就有380+行,直接分析这段代码很容易被代码逻辑弄晕。所以我们先分析一段简单的ajax代码,来自早期的百度七巧板项目。通过这个来先复习一遍ajax的知识。baidu.ajax.request分离版/** * 发送一个ajax请求 * @author: allstar, erik, berg * @name ajax.request * @function * @grammar ajax.request(url[, options]) * @ 阅读全文
-
Jquery插件 -- 表格固定表头
摘要:Table固定表头是老生常谈的东西,从网上看了很多人的实现,但都不够满意,很多原因,比如说效果根本就没实现,要不就是易用性很差,于是自己试着写了一个Jquery固定表头的插件,与各位共享,此插件还在测试阶段,如果想要直接使用请各位根据自己项目微调。实现原理图:针对原理图的说明: 所有的行(tr)可分为表头和表体两部分,把表格拆分为两个表格,第一个表格放表头,第二个表格放表体,我们要拖动的是表体,所以把第二个表格再用一层div包装起来,目的是为了Scroll,之后整体再用一层大的div包裹起来,看上去就成了一个完整的表格,其实成型的效果是有2个div,2个table组装而成的,而原来的那个... 阅读全文
-
JavaScript 中的事件流
摘要:事件流是指在开发过程中当有外界元素触发事件时,该元素的容器控件及整个页面都按照特定顺序的响应该元素的触发事件,也通常指触发的顺序 其中又分为 A、冒泡型事件流B、 捕获型事件流C、 DOM事件流A 先分析冒泡事件流冒泡事件流其实就是IE提供的事件流,当然这样理解也不够全面, 而冒泡流的核心主要是依照触发事件的控制的父控件的层及顺序依次触发,既事件由明确的事件源到其最不明确的事件源依次触发,最不明确的一定是document对象,(通过stopPropagation阻止冒泡 新式浏览器)如:?<scripttype="text/javascript">functio 阅读全文
-
getCurrentScript的改进
摘要:getCurrentScript的改进第一版functiongetCurrentScript(){if(DOC.currentScript){returnDOC.currentScript.src}varnodes = head.getElementsByTagName("script")//只在head标签中寻找for(vari = 0, node; node = nodes[i++];) {if( node.readyState === "interactive") {returnnode.className = node.src;}}}第二版增加对 阅读全文
-
我的模块加载系统 v22
摘要:时隔差不多两个月,积累了许多改进,升级到v22。主要改进点如下:进行瘦身,移除本地储存IE6789的HTML5新标签支持列表,添加一个 m标签loadJS内容方法,在动态插入script节点,发现最新的firefox做了些改动,如果head还没有解析完就插入节点,那么新script会触发onerror事件。补救措施,针对firefox使用html.insertBefore(node, head)。chrome不支持head.insertBefore(node, null),第二参数必须是节点,因此firefox外浏览器统一使用 head.insertBefore(node, head.firs 阅读全文