很早就在博客园看到过利用HTML5拖放上传文件功能的文章，一直没机会自己试一试，今天心血来潮也试了下，参考了4、5个网站，东拼西凑终于实现了，效果如下：http://yilee.info/media/html5-drag-drop-pic/upload.html
HTML5拖拽上传文件
1
Tag Archives: 前端
Struts2 jQuery 实现无刷新验证
在注册时我们需要验证用户所输信息的正确性，如果待用户提交表单一次性验证，体验不是很好，所有我们可以利用jQuery实时验证，很多网站都有这个功能，这里我们也简单的来实现一下。以验证用户名为例，可以这样实现：当用户名的输入框失去焦点时，利用jQuery的post方法通过HTTP POST 将用户名以JSON格式传向服务端，服务端接收数据判断后以JSON格式传给jQuery的回调函数即可，很简单的。
CSS 限制图片最大宽度
换WordPress主题时，如果我们一个很宽的主题换为一个比较窄的主题，有些文章内的图片很可能为超出主题宽度，非常不美观。
但是，我们又不能定死，否则图片会变形。
下面是找来的一段CSS，传说兼容IE6。
.img{
max-width: 500px;
height:auto;
width:expression(this.width > 500 ? "500px" : this.width);
}
max-width: 500px;
height:auto;
width:expression(this.width > 500 ? "500px" : this.width);
}
这段CSS代码可以让图片在超过规定的宽度时，自动缩小，并且是按比例缩小，不会造成图片变形，我们把它加在WordPress主题的CSS中即可。
PS：CSS expression占用CPU大，如果用户机器差，打开一张巨图，肯定死翘翹。。。
jQuery学习笔记四 事件
事件是javascript的灵魂,，jQuery的事件模块是较复杂的，本文具体来研究下最常用的绑定事件、删除事件和触发事件。
jQuery学习笔记三 jQuery对DOM的一些操作
DOM(Document Object Model)文档对象模型，是一种与浏览器、平台、语言无关的接口，使用该接口可以轻松地访问页面中所有的标准组件，jQuery大大简化了对DOM元素的操作，这也是jQuery的亮点之一。下面分以下几部分介绍一下jQuery对DOM的操作，包括jQuery对DOM元素的创建并插入，移除，替换，复制，更改DOM的属性。。。 Continue reading
jQuery学习笔记二 end()方法
最近在学习jQuery方面的知识，对end()方法感到怪怪的，在jQuery官方的API上是这样描述end()方法的：
回到最近的一个"破坏性"操作之前。即，将匹配的元素列表变为前一次的状态。
官方给的例子并不是很明显，不能很好的理解end方法。
jQuery学习笔记 一些基础
首先说说我为什么想学jQuery，一是想完善一下http://ttt.yilee.info，二是想自己想写一些特效，用在WordPress上，这样就不用插件了，very cool。。。
jQuery是JavaScript的一个框架，它是轻量级的js库(压缩后只有几十k) ，兼容各种浏览器（觉得这点就够cool了）。jQuery使用户能更方便地处理HTML documents、events、实现动画效果，并且方便地为网站提供Ajax交互。
Struts2整合JQuery开发Web程序
眼下很多Web项目都是选择 Struts2 作为表现层.在09年底我去过阿里几个部门面试,无一例外都提到了这个框架.
Struts2 能够这么快就让众多程序员放下Struts1的原因在于它的许多更优异的改进之外,还有一方面就是它的插件体系.
本文要讲的就是运用插件,Struts2可以和JQuery 完美结合.
我假定你已经在你的项目中选择了Struts2,你的项目中会有一些表单需要作前端验证, 比如登录表单, 注册表单等等, 甚至, 你还想加一些Ajax进去, 这一切, Struts2和它的JQuery 插件可以帮你搞定.
OK, 在讲这些之前, 可以先看看Jquery 插件的 Show case, 以印证我之前提到的所谓的完美. Continue reading