使用javascript实现回车提交表单

在web开发中,表单提交是最普通不过的事情了,也是使用很频繁的一种交互方式,例如我们几乎每天都有遇到的用户登陆。

绝大部分的网站在为用户提供服务时都要求用户进行登陆,这无可厚非,暂时也是必然的选择,否则怎么能为用户提供个性化的服务呢?

闲话又扯了一大堆,说正事吧。登陆既然必不可少,那就登陆呗,不过这里也是有些值得探究的。现在不都提倡用户体验吗,登陆这个事情自然也应该优化一下,其实这个早在很多年前就有了,比如登陆时的记住密码,选中后用户下次访问网站就不必再进行登陆了,不过对于现代人对隐私性的要求及安全性的考虑,有些时候是不太适合做记住密码处理的,这样用户每次必须重新登陆才可。

记得有人说过,能让用户点一下,就不要让用户点两下,我们的上帝时间很宝贵的,也是很懒的哦,呵呵。出于这样的考虑,当用户输入完用户名、密码时,接下来要做的就是点击登陆,可是一般情况下,输入是在键盘上操作的,而要点击“登陆”,需要换手到鼠标,然后移动到登陆按钮上点击才能完成登陆,这样的操作虽然并不是很麻烦,但是本着精益求精的精神,我们应该压榨再压榨,把它榨干为止。

其实很简单啦,用户输入完成,敲下回车就能实现登陆,这样的速度绝对秒杀鼠标点点吧。

这里飞尘要想多了一点,其它的表单也是可以回车提交的,所以这里处理起来有一点需要注意的,填表单的时候,一般情况下浏览器会记录用户曾经输入的内容,如果用户输入相同的内容,之前的历史会下拉显示,这时用户通过键盘方向键可以直接选择内容,回车确定,这里就需要将这样的回车区别开来,否则直接提交表单就不是我们所希望的了。

罗里吧嗦的说了那么多,口都干了,赶紧上点实货吧。众里寻他千百度,暮然回首,代码就在灯火阑珊处。

删除ckeditor中图片

作为富文本编辑器,ckeditor提供了丰富的功能供使用,自然图片上传是比不可缺的。

对于服务端如何配合图片上传不在本文的讨论范围,这个相信搜索一下就不乏大面积的教程文章之类的。

飞尘在这里是遇到这样的功能需要,图片上传之后,需要一个删除功能,可能这样表述的不是很明确。就以一般论坛为例,发过帖子的都应该知道,可以上传附件,附件上传后也可以删除。这里的图片也做类似的处理,即有个图片附件的列表,显示所有已经上传的图片,图片上传后是可以直接插入到当前编辑的内容中的,此时如果在图片附件列表中删除了某个图片,而图片已经被插入到内容中,就会出现不同步的情况,编辑的内容在显示的时候就会引用一张被删除的图片,这是我们不希望看到的。

于是我们希望删除图片附件的同时,将编辑内容中的图片也一并删除,这样就可以保持同步了。

思路大概是这个样子,图片的地址在上传后我们是知道的,这样在删除图片附件时,从编辑内容中查找到该图片节点,并将其删除,看上去好像很简单哦,嗯,的确使得,嘿嘿。

那就不再多啰嗦了,附上一段样例代码吧:

5款常用富文本编辑器比较

CKEditor

简介

原名FCKeditor,起始于2003年,截至2009年累计下载350万次,并于同年改名为CKEditor。

最新版本

CKEditor 3.6.5 – 2012-10-10发布

CKEditor for Drupal 3.6.3 – 2012-04-25发布

CKEditor for Joomla 3.6.3 – 2012-04-23发布

CKEditor for ASP.NET 3.6.4 – 2012-08-08发布

CKEditor for Java 3.6.4 – 2012-08-08发布

FCKeditor 2.6.8 – 2012-08-02发布

CKEditor 4 Bate

协议

开源协议GPL、LGPL、MPL

支持商业协议CDL

特点

clip_image002

    支持多国语言(中文)

    多套皮肤

    文档详细(英文)

兼容性

    IE 6+

    Firefox 3.0+

    Safari

    Opera

    Chrome

链接

官方网站 | 文档 | 演示

TinyMCE

简介

始于2003年,由Moxiecode社区对其提供官方技术支持。

最新版本

TinyMCE 3.5.7 – 2012-20-09发布

协议

开源协议LGPL

支持商业协议

特点

clip_image004

    支持多国语言(中文需下载语言文件)

    自定义皮肤、主题

    文档详细(英文)

兼容性

    IE 6+

    Firefox

    Safari

    Opera

    Chrome

链接

官方网站 | 文档 | 演示 | 语言文件下载

UEditor

简介

UEditor始于2011年,是由百度web前端研发部开发所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点。

最新版本

UEditor 1.2.3.0 – 2012-08-28发布

提供PHP、.Net、Java三种版本

协议

开源协议BSD

特点

clip_image006

    支持中文和英文两种语言

    全中文文档

    上传需要flash支持

兼容性

    IE 6+

    Firefox

    Safari

    Opera

    Chrome

链接

官方网站 | 文档 | 演示

KindEditor

简介

始于2006年,2011年04月成立上海浩跃软件有限公司,开始KindEditor的商业化运营。

最新版本

KindEditor 4.1.3 – 2012-10-14发布

协议

开源协议LGPL

支持商业协议

特点

clip_image008

    支持中文、英文、阿拉伯文

    中文文档

兼容性

    IE 6+

    Firefox

    Safari

    Opera

    Chrome

链接

官方网站 | 文档 | 演示

xhEditor

简介

始于2009年,文件体积较小。

最新版本

xhEditor v1.1.14 – 2012-07-28发布

协议

开源协议LGPL

支持商业协议

特点

clip_image010

    功能简洁

    支持中文和英文

    多套皮肤

兼容性

    IE 6+

    Firefox

    Safari

    Opera

    Chrome

链接

官方网站 | 文档 | 演示

开源许可证异同简单对比

现在的开源软件是越来越多了,面对各种各样的开源协议,又了解多少呢?

工欲善其事必先利其器,搞清楚协议才好拿来使用。

对于各个开源协议的定义就不展开了,反正飞尘是没有仔细去研究。擒贼先擒王,抓住重点才是,下面就是常见的开源许可证之间的异同简单对比了,供参考。

相同点

1、承认版权;

2、发布的义务——将获得的源代码再发布;

3、对发布的源代码的要求——须保证源代码的完整和可以被获得;

4、允许修改——可以根据获得的源代码产生演绎作品;

5、没有担保

不同点

是否允许同其他非开放源代码软件代码混合

是否可以不公开对源代码的修改

是否明确了专利许可授权

是否明确了专利侵权诉讼导致许可证协议终止

是否明 确禁止与函数库连接

是否只能按本许可证发布源代码

GPL 许可证

LGPL 许可证

BSD 许可证

NPL 许可证

?

MPL 许可证

QPL 许可证

QNCL 许可证

APACHE 许可证

SISSL 许可证

Jabber 许可证

IBM 许可证

CPL许可证

 

说明:

 “#”指对于原始获得的源代码及修改的源代码,必须按本许可证及本许可证的后续版本发布,但是可以将源代码及修改过的源代码与其他类型的不受本许可证约束的代码结合,以新产品的形式发布。

  “不担保”(即No Warranty)条款: 由于源代码程序准予免费使用,在一般情况下,对程序没有担保。除非另有书面说明,版权所有者或其他提供程序的人们“一样”不提供任何类型的担保。如果程序出现缺陷,被许可人承担所有必要的服务,修复和改正的费用。

vmware安装linux客户机共享目录/mnt/hgfs为空

由于文件的搜索功能需要调用linux命令来实现,在现有windows平台下就无法测试了,于是不得不开个linux的虚拟机来调试。

在vmware中安装了ubuntu12.04,安装好了tools,但是发现设置共享目录时遇到个小问题。

按照之前客户机为windows的情况操作,宿主机设置好共享后客户机就可以看到了,但是linux似乎有点不太一样。

对于linux而言,宿主机的共享目录应该出现在/mnt/hgfs目录下,但是刷新了几下依然看不到,郁闷哪。

sudo apt-get install open-vm-dkms

会提示一些配置先Y,在N、N、N……下去

共享禁用再启用就可以刷新看到共享目录了

使用CryptoJS进行sha1哈希报错

按照官方给出的例子使用CryptoJS进行sha1哈希:
http://code.google.com/p/crypto-js/#SHA-1

从form中取得密码后,进行sha1散列,之后作为参数post到服务器,firebug报错:

a is undefined——————sha1.js (第 8 行)

之前也有使用过CryptoJS没有问题的,在firebug控制台直接执行

CryptoJS.SHA1($(‘#password’).val());

没有问题,不过返回值似乎有些特点:

7c4a8d09ca3762af61e59520943dc26494f8941b { $super=, words=[5], sigBytes=20}

很明显是个对象,而不是简单的字符串

查了一下原来是jquery那边转换时出错了,转换一下就ok了:

CryptoJS.SHA1(‘Message’) + ”;
或者
CryptoJS.SHA1(‘Message’).toString();

示例代码:

更详细的讨论可以查看这里

http://code.google.com/p/crypto-js/issues/detail?id=41