本文转自：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>

[转]jQuery为控件添加水印文字的更多相关文章

  1. jQuery操作控件

    在项目中添加前台控件radio,操作两个div的显示和隐藏,其实是一个很简单的问题,但是费了老大劲才完成,也就是jQuery操作控件的一些基础知识.方法有三种,简单介绍: 1.给元素设置style属性 ...

  2. 精确到秒的JQuery日期控件

    项目中需要用到精确到秒的日期控件,到网上搜了一下,发现有一个JQuery控件可以实现该功能---TimerPicker.但是官网上没有提供该控件的完整Demo,而且没有提供汉化包,所以自己汉化了一下, ...

  3. Jquery获得控件值的方法

    一 Jquery获得服务器控件值的方法 由于ASP.NET网页运行后,服务器控件会随机生成客户端id,jquery获取时候不太好操作,google了下,总结有以下3种方法: 服务器控件代码:<a ...

  4. jquery 分页控件2

    jquery 分页控件(二) 上一章主要是关于分页控件的原理,代码也没有重构.在这一章会附上小插件的下载链接,插件主要就是重构逻辑部分,具体可以下载源文件看下,源代码也有注释.为了测试这个插件是能用的 ...

  5. jquery 分页控件1

    jquery 分页控件(一) 以前一直都是用别人的分页控件,虽然用得很爽,但总觉的还是自己写个小插件比较好,这个插件效果.代码等都有参照别人完成的控件.即便功能并不是那么完善,扩展性也不好,bug或许 ...

  6. checkbox、radio控件和文字不对其

    一般使用html控件的时候  单选按钮和复选框的控件和文字不对齐 给input控件加上   style="vertical-align: middle; margin-top: -2px; ...

  7. 针对 jQuery Gridly 控件显示多少列的问题。

    针对 jQuery Gridly 控件显示多少列的问题,完全根据 columns 的值来显示. 但是显示columns,并不是给多少值显示几列.到目前还是很模糊的.官方文档没有给出具体的一个解释. $ ...

  8. checkbox、radio控件和文字不对齐

    一般使用html控件的时候  单选按钮和复选框的控件和文字不对齐 给input控件加上   style="vertical-align: middle; margin-top: -2px; ...

  9. jQuery树形控件zTree使用小结

    作者:Fonour 字体:[增加 减小] 类型:转载 时间:2016-08-02我要评论 这篇文章主要为大家详细介绍了jQuery树形控件zTree使用方法,zTree树插件的基本使用方法,感兴趣的小 ...

随机推荐

  1. Netty学习大纲

    1.BIO.NIO和AIO2.Netty 的各大组件3.Netty的线程模型4.TCP 粘包/拆包的原因及解决方法5.了解哪几种序列化协议?包括使用场景和如何去选择6.Netty的零拷贝实现7.Net ...

  2. wget下载jdk 蛋疼问题

    wget --no-check-certificate --no-cookies --header "Cookie: gpw_e24=http%3A%2F%2Fwww.oracle.com% ...

  3. mysql服务启动不了解决方法

    sudo lsof |grep deleted  找占用大的kill一下,  一般是tomcat log和zookeeper的out比较吃磁盘 du -h --max-depth=1 / 今天作死,想 ...

  4. Promise 异步函数顺序执行

    可以满足需求,且使用方法和Promise.all统一 var a = function() { return new Promise(function(resolve, reject) { setTi ...

  5. EasyUi取消选中表格的所有行

  6. ASP.NET-GridView分页排序显示

    前期我们分别介绍了gridview怎么进行固定表多行数据显示,以及怎么设计花样表头.下面我们介绍怎么利用gridview进行分页显示的同时还可以进行排序显示. 显示效果 前端DEMO <span ...

  7. CI框架源码学习笔记3——Log.php

    上一节说完了Common.php,然而跟代码打交道总是免不了日志记录,所以这一节我们说说Log.php文件. 先看看类里面的几个属性, protected $_log_path;  日志路径 prot ...

  8. dedecms图片绝对路径(附件绑定域名)的设置方法

    dedecms默认的附件路径使用的是相对路径,但是在实际应用,我们可能会需要让文章的图片附件显示绝对地址,解决方案如下: 1.打开include目录下的文件extend.func.php,添加函数re ...

  9. node mysql问题：Client does not support authentication protocol requested by server; consider upgrading MySQL client！

    node后台 mysql处理模块(版本:2.16.0) 执行connect方法时报错: Client does not support authentication protocol requeste ...

  10. kuangbin专题七 HDU3974 Assign the task （dfs时间戳建树）

    There is a company that has N employees(numbered from 1 to N),every employee in the company has a im ...