说说回车键触发表单提交的问题
作者:yafan99 日期:2009-02-12
我们有时候希望回车键敲在文本框（input element）里来提交表单（form），但有时候又不希望如此。比如搜索行为，希望输入完关键词之后直接按回车键立即提交表单，而有些复杂表单，可能要避免回车键误操作在未完成表单填写的时候就触发了表单提交。
要控制这些行为，不需要借助JS，浏览器已经帮我们做了这些处理，这里总结几条规则：
1、如果表单里有一个type=”submit”的按钮，回车键生效。
2、如果表单里只有一个type=”text”的input，不管按钮是什么type，回车键生效。
3、如果按钮不是用input，而是用button，并且没有加type，IE下默认为type=button，FX默认为type=submit。
4、其他表单元素如textarea、select不影响，radio checkbox不影响触发规则，但本身在FX下会响应回车键，在IE下不响应。
5、type=”image”的input，效果等同于type=”submit”，不知道为什么会设计这样一种type，不推荐使用，应该用CSS添加背景图合适些。
实际应用的时候，要让表单响应回车键很容易，保证表单里有个type=”submit”的按钮就行。而当只有一个文本框又不希望响应回车键怎么办呢？我的方法有点别扭，就是再写一个无意义的文本框，隐藏起来。根据第3条规则，我们在用button的时候，尽量显式声明type以使浏览器表现一致。
做了一个demo列出了一些例子。
注：文章和demo于2009-2-2更新
注册表单的规则——读《Patterns for Sign Up &Ramp Up》
作者:yafan99 日期:2009-02-11
《Patterns for Sign Up &Ramp Up》很早就读完了，之所以今天才写读后感，细细读完了发现，它更为接近吸引注册、提升活跃度的社区构建引导，是一份社区活跃会员度研究的好资料。
既然答应写读后感，就从我的视角来说一点与注册有关的东西，先把整篇资料的骨架分解一下，然后再结合其中观点谈目前的感受。
注册其实是个有点枯燥的任务，《Patterns for Sign Up &Ramp Up》里提到的观点是：
Give the user good reasons to join——乍看起来有点营销的味道，事物的本质不变，但人的情绪是可以扭转的——让用户有充分的理由来注册；
Make the sign-up process feel effortless——改变枯燥令人生厌的感觉，就是我们需要做的努力：让表单或整个注册过程变得轻松省力；
Don’t leave new users hanging——这个观点在整篇资料里的意义侧重于提升活跃度的办法——用户不是完成了注册就完成了使命，了解社区的新事物才是刚刚开始；
Accelerate initial connection-making——如果说活跃度从上一个观点拉开序幕，那么这里就是如何使用户在社区里开始生活，建立联系比如通过自己之前发布的信息来联系好友，真的体验海内存知己，天涯若比邻的感觉。
整篇的骨架结构就是一个循序渐进的行为引导，为facebook的引入会员、维护社区活跃的初始引导，做了详细的注解和指导，可做手册查阅。读后侧重工作的总结，梳理几条注册表单的规则：
I.当表单结构需要多步时，需要注意的是给出清晰的导航
a. 使用进度标尺来告诉用户当前的位置和整个步骤
b. 强调几个步骤中的逻辑联系，比如标明：step1、step2、step3
c. 用有意义的图片或ICON甚至是标题来解释各个步骤
d. 使用简单的语言或第二人称描述行为动作
e. 逻辑步骤最好限制在3步内
II.用户在注册行为中的提示
a. 提示信息（tips）尽量在需要帮助或有前后行为衔接的地方出现
b. 对用户的鼓励应在进程中体现，如每完成一项输入提示一个打勾的图标
c. 尽量避免出现弹出框的警示提醒
d. ICON的出错提示避免用警告的表达，使用户有挫败感
e. 简单易识别的ICON来标记提示、成功、出错的样式
f. 提交表单时如果有出错，过长的表单最好将出错提醒显示在整表头部，指引用户改正
Javascript正则表达式基础
作者:yafan99 日期:2009-02-10
RegExp对象的语义和使用：
- 检查字符串匹配
- 获取字符串中的部分内容
- 在原字符串的基础上构建一个新的字符串（包括添加、删除和修改）
构建一个RegExp对象主要有两种方法：
- 使用literal，如/\w/g
- 使用构造函数，如 new RegExp(/\w/)
构建RegExp对象有以下几个注意点：
- literal常用来构建非runtime产生的静态的RegExp对象
- literal之后可以直接添加flag用来对匹配字符串的执行结果进行限制，常用flag包括g和i，分别用来表示全局匹配(global)和忽略大小写匹配(case-insensitive)
- RegExp构造函数的第一个参数提供该对象的pattern，如果pattern是一个RegExp literal，那么就不能提供第二个参数(即指定flag)。如果pattern是一个string，那么可以使用第二个参数
- RegExp构造函数常用于构建runtime产生的动态RegExp对象
- RegExp的pattern为string时所有literal中的”\”都必须写成”\\”，因为”\”在string中需要被转义
- 以上两种方法构建的都一个javascript对象，因此/\w/ == /\w/返回false
RegExp对象相关的功能：
- 要检查字符串的匹配，可以使用 regExp.test(string) 方法，该方法检查string是否匹配regExp提供的pattern。还可以使用 string.search(regExp)方法，如果两者不匹配将会返回-1
- 要获取字符串中的部分内容，可以使用 regExp.exec(string) 方法，也可以使用string.match(regExp)方法
- 要在原有字符串上构建一个新的字符串，通常使用string.replace(searchValue, replaceValue)方法
RegExp对象中提供pattern的语义：
- RegExp可以定义多个Alternative用”|”分割，该运算的优先级最低，因此如果存在”|”，那么它首先把RegExp分割成几大部分
- 每个Alternative由多个term组成，term分为assertion（用于位置限定），atom（匹配的单元），带Quantifier（修饰符）的atom
- assertion分为”^”用于匹配字符串开头，在multiInput（即flag包含m时），也可以匹配一行的开头，”$”用于匹配字符串结尾，在multiInput（即flag包含m时），也可以匹配一行的结尾，”\b”用于匹配一个\w和\W间隔，注意它并不匹配任何字符串中的内容，而只是用来判断一个位置的匹配情况
- atom的情况比较复杂，我们首先来看atom的Quantifier，可以包含* + ? {n} {m,} {m,n}，其中*表示atom可以有0次或以上的重复，+表示1次或以上的重复，?表示0或1次，{n}表示恰巧n次重复，{m,}表示m或以上的重复，{m,n}表示重复次数在m和n之间（包含m和n），在以上的Quantifier之后还可以跟一个?用来启动non-greedy模式，我将在后文中说明这种模式的意义。
- atom包含patternCharacter（普通字符，即在pattern中没有特殊语义的字符，匹配时将按照字面进行匹配）
- “.” 匹配所有非line-terminator字符
- \AtomEscape 包含数字型 \1（用于引用之前的括号中的匹配成功的内容）。一些字符的引用\n \f \r \t \v \xNN \uXXXX \cX等。一些特殊含义的字符，如\d \D \s \S \w \W
- CharacterClass，包含[...]和[^...]两种形式。其中可以包含很多字符，如-、 \n等字符引用、\b、\d等特殊含义字符。注意如果”-”左右有字符，那么语义变为从某一字符到某一字符。如果”-”左或者右没有字符，那么”-”仅表示dash字符。
- (group)，以上模式进行group就可以在group之后使用Quantifier修饰
- (?:group)，仅作为group使用，而不会记录group匹配的内容从而不算在\1..\n中
- (?=group)，要求匹配但不会在返回的匹配string中包含group匹配的内容
- (?!group)，要求不匹配且不会在返回的匹配string中包含group匹配的内容
下面我要讲一下RegExp的两个比较重要的运作模式：
匹配Alternative总是从左到右，如果遇到第一个匹配的就不再尝试之后的匹配，如
/ab|abc/.exec("abc")以上字符串”abc”仅匹配pattern中的ab，而不会去匹配abc
匹配时总是一般不在Quantifier后添加?的都使用greedy模式，添加?后使用non-greedy模式，如
/\w+bc/.exec("abcbcbc")Tags: JavaScript 正则表达式 正则式
《读者》精选语段10条
作者:yafan99 日期:2009-02-08
鉴于这周比较忙，而读者言论的精辟实在让人敬佩，又截上一段与大家分享呵呵，下次一定亲自撰写：
1.每天赚到一万元。
——一项对年龄四至六岁儿童有关财富的抽样调查发现，中国大陆70以上的儿童希望能够成为富翁，以上是他们想象中富人生活的内容之一，其余还包括：有钱、房子住得好、有小车、有事业
2.女人如果不性感，就要感性；如果没有感性，就要理性；如果没有理性，就要有自知之明；如果连这个都没有了，她只有不幸。
——台湾漫画家朱德庸论女人
3.我想可能是现在的读者太脆弱了。
——海岩回答他的作品何以打动人
4.庄子、范蠡、项羽、周瑜。
——新浪网友素手鸣琴浮想联翩，列出从古到今的中国男人中，“一生最想嫁的四个极品男人”
5.人们想用钞票时，从不看它的发行日期。
——深圳某年轻俊男娶了一个大款老太，面对人们的困惑，他自揭谜底
6.20-25岁，大专以上；在读亦可，品德优良；容貌出众，秀丽端庄；体态婀娜，健康丰腴；才韵内敛，温柔可人；生具母爱，惜子敬夫；清纯如水，无性经历；家境平实，官贵免谈；户籍不限，民族不限。
——4月中旬，一位自称身价过亿的35岁离异富翁在《南方晚报》、《扬子晚报》等全国16家媒体刊登的一则征婚广告，其中“无性经历”一条引起了人们的议论纷纷
7.最强的一句：
人不犯傻，我不犯傻，人若犯贱，我必更贱。
——专栏作家沈宏非概括的派对着装原则。
8、王子们都开始隐居了，女人们看见的都是白马。
——南京的都市放牛在专栏文章《我是个扛枪的猎人》里说，白马王子的时代似乎已经结束，只剩下动物性的本能了，“所以我现在不单纯，原则上都是女人的责任，或者说，给木子美们逼的”。
9、世界历史文化遗产——端门。
——一些游客发现在自称“世界历史文化遗产”北京端门城楼上，所看到的景观与宣传语大相径庭，而且在世界遗产名录的分类上只有文化遗产、自然遗产和自然文化遗产，根本就没有“历史文化遗产”一说。
10、年龄选择小的，身体选择强壮的。第一点体现公平，第二点是存活概率。
——有人援引登雪山运动中的优先救援对象的标准来回答让很多男人头痛的“母亲和媳妇落水，先救哪个”的两难命题。
11、让男的去当和尚。
——一位网民调侃道。目前，中国新生婴儿中男孩与女孩的比例为116.86∶100，比正常值105∶100高出很多。要实现出生婴儿性别比正常，必须改变中国人目前的婚育观念和生育文化。
女白领办公室外交六准则
作者:yafan99 日期:2009-02-04
在一个非常男性化的世界里，女性要想成功，无疑要付出比男人多数倍的努力。职业女性首先要认识到的就是，职业不过是你的角色之一，不要对自己的心理需求视而不见。遇到困难不要逃避，及时沟通和宣泄才是解决之道。即使在办公场合，我们也需要女性温柔的一面。白领女性在办公室一定要恪守六大准则，为自己营造一个和谐的工作空间。
1、不要和同事有过密私交。
通常朋友是我们在遇到困难时第一个想到的人，但是再好的朋友一旦碰到利益的纷争，势必会产生矛盾。
平常过密的私交可能会为自己埋下定时炸弹，遇到利益相冲时，甚至会产生严重的心理伤害。
2、用热情温暖每一个同事。
学会每天来到公司，对每一个遇见的同事说声：你好。不管是不是同一部门的同事，都要主动打招呼。总经理、主任、资料员、门卫、保洁员，大家只有分工不同，并没有高低贵贱之分。你需要记住的是，尊重别人就是尊重你自己。
3、修饰自己也要赞美别人。
职业女性的外表修饰无疑是每天良好工作的开端，恰当的服装、典雅的妆容，不但能调节办公气氛，还能营造美好心情。在扮美自己的同时，也不要忘记赞美身边的同事，不要怕肉麻，其实大家都需要一点点赞美。
4、尊重领导还需努力沟通。
不少女性由于害怕被别人闲话而远离男性领导。其实，适当的沟通无疑能为你的工作营造良好的环境。当然了与领导的接触最好选择在工作时间，比如共进午餐。
