适配 placeholder,jquery版
<!doctype html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>适配placeholder </title> </head> <body> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <script> /** + ---------------------------------------- + + 适配placeholder + Author: zzf + Date: 2012-4-5 + ---------------------------------------- + **/ jQuery.fn.placeholder = function () { return this.each(function(){ if ('placeholder' in document.createElement(this.tagName)) return; var self = this, placeholder = self.getAttribute('placeholder') || self.getAttribute('value'), el = jQuery(self); //如果placeholder和value属性同时存在,以placeholder为准 if (self.value === '' || self.value !== placeholder) { self.value = placeholder; } el.bind({ 'focus':function (){ this.value === placeholder && (this.value = ''); }, 'blur':function (){ this.value === '' && (this.value = placeholder); } }) }) }; //测试 $(document).ready(function (){ $('#test-wrap').find('.demo').placeholder(); }) </script> <div id="test-wrap"> <input id="" class="demo" type="text" name="" placeholder="text的placeholder" /> <br /><br /> <textarea id="" class="demo" name="" rows="" cols="20" placeholder="textarea的placeholder" ></textarea><br /> </div> </body> </html>
分类:
jquery
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 智能桌面机器人:用.NET IoT库控制舵机并多方法播放表情
· Linux glibc自带哈希表的用例及性能测试
· 深入理解 Mybatis 分库分表执行原理
· 如何打造一个高并发系统?
· .NET Core GC压缩(compact_phase)底层原理浅谈
· DeepSeek火爆全网,官网宕机?本地部署一个随便玩「LLM探索」
· 【译】.NET 升级助手现在支持升级到集中式包管理
· 开发者新选择:用DeepSeek实现Cursor级智能编程的免费方案
· 独立开发经验谈:如何通过 Docker 让潜在客户快速体验你的系统
· 并发编程 - 线程同步(二)