jQuery为控件添加水印文字

来源：互联网发布：知乎美的中央研究院编辑：程序博客网时间：2024/05/16 02:37

(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);

<html xmlns="http://www.w3.org/1999/xhtml" ><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>