作者kerash (K.T)
看板Ajax
标题[讨论] placeholder js 版
时间Thu Apr 26 14:24:05 2012
在 html5 可以使用 placeholder 让输入框有提示需输入内容的功能
在这之前大多数的 placeholder 都是用 js 判断预设内容
例如:
若 value 为 placeholder 的文字,就加入做为 placeholder 的 class
反之就把预设内容清除并且把 class 消除
由於这种状况在遇到必填资料时,若判断内容是否为空时会很麻烦
得再多一次判断内容是否为预设文字之类的方法
(虽然用 jQuery 去加入事件也很快啦QQ)
个人因为想当作学习也想制作自己的解决方案
所以参照了 hotmail 的登入方式,
用 div 盖上去的方法来做假的 placeholder
并且想让所有设定的东西一次套用上,
因此就尝试自己初学写一个 jQuery 的 plug-in
一方面当做纪录,一方面想请大家指导一下我的 code 有哪些需要改进的部分
因为说实在话我的观念都是网路拼拼凑凑,难免会错误
所以一边学习一边请教大家指导了 m(_ _)m
以下是网址
: http://kerash.net16.net/work/placeholder/v1_1/placeholder_v1_1.html
NEW:
http://kerash.net16.net/work/placeholder/v1_2/placeholder_v1_2.html
更新: 修正位移、修正判断 placeholder 属性
(原本有 v1.0 版,纯用 js 语法写出来的,但是因为意外删除CODE後就回不来了QQ..)
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 114.34.30.6
1F:→ dinos:用tab就.... 04/26 18:03
2F:→ kerash:tab的话用tabindex应该可以解决(? 04/26 19:27
3F:→ kerash:晚点用电脑测试看看 04/26 19:27
4F:→ kerash:会错意了,是把click改成focus ..@@ 04/26 20:07
5F:推 zombiesky:感觉不错 给个推! 04/26 23:43
6F:→ akiratw:缩放网页之後位置就跑掉了 04/27 00:52
7F:→ akiratw:另外可以直接用 placeholder="..." 属性相容 HTML5 04/27 00:54
8F:→ akiratw:如果浏览器已经有 placeholder 功能就不用再产生一次了 04/27 00:55
9F:→ akiratw:if('placeholder' in document.createElement('input')){ 04/27 00:59
10F:→ akiratw:↑判断浏览器是否支援 placeholder 04/27 00:59
11F:→ kerash:感谢akira,我原本就是想找判断原本功能就有的状况 04/27 08:51
12F:→ kerash:只是还不确定要怎麽找! 我会在修改的 谢谢 04/27 08:52
13F:→ kerash:位置的话我在设定网页移动後的定位 04/27 08:52
14F:→ TonyQ:我也有做过类似的东西~ 04/27 10:54
15F:→ kerash:Tony 大愿意分享参考吗 :)? 04/27 11:01
16F:→ TonyQ:基本上是一样的作法啦 :) 04/27 12:24
17F:→ kerash:恩~谢谢,至少知道方向还没算走错~ 04/27 12:28
※ 编辑: kerash 来自: 114.32.186.193 (04/27 22:24)