[转]jQuery为控件添加水印文字
本文转自:http://www.cnblogs.com/gzh4455/archive/2011/09/29/2195418.html
jQuery扩展:
jquery.tinywatermark-3.1.0.js文件代码:
( function ($) { $.fn.watermark = function (c, t) { var e = function (e) { var i = $( this ); if (!i.val()) { var w = t || i.attr( 'title' ), $c = $($( "<div />" ).append(i.clone()).html().replace(/type=\ "?password\"?/, 'type=" text"')).val(w).addClass(c); i.replaceWith($c); $c.focus( function () { $c.replaceWith(i); setTimeout( function () {i.focus();}, 1); }) .change( function (e) { i.val($c.val()); $c.val(w); i.val() && $c.replaceWith(i); }) .closest( 'form' ).submit( function () { $c.replaceWith(i); }); } }; return $( this ).live( 'blur change' , e).change(); }; })(jQuery); |
或者访问网址:http://plugins.jquery.com/files/jquery.tinywatermark-3.1.0.js_.txt
用法:
<head runat= "server" > <title>WaterMark</title> <script src= "../JS/jquery-1.5.2.min.js" type= "text/javascript" ></script> <script src= "../JS/jquery.tinywatermark-3.1.0.js" type= "text/javascript" ></script> <script type= "text/javascript" language= "javascript" > $( function () { $( "input[title='Month']" ).watermark( 'watermark' , 'Title' ); $( "textarea[title='Content']" ).watermark( 'watermark' , 'Please input the content !' );; }); </script> <style type= "text/css" > .watermark {color: #999;} </style> </head> <body> <form id= "form1" runat= "server" > <div> <div><input title= "Month" /></div> <div><textarea id= "TextArea1" cols= "20" rows= "2" title= "Content" ></textarea></div> </div> </form> </body> </html> |
posted on 2013-09-25 08:33 freeliver54 阅读(1756) 评论(1) 编辑 收藏 举报