用jquery实现输入框消失文字 - 刘文涛 - ITeye博客

`

wentao365

浏览: 1431722 次
性别:
来自: 北京

最近访客更多访客>>

有你不孤单

wuzijingaip

wmzhsqy

ssydxa219

博主相关

博客

微博

相册

收藏

留言

关于我

文章分类

社区版块

存档分类

最新评论

a98709474：写的很详细，看完了，明白了这种概念了
数据库水平切分(拆库拆表)的实现原理解析(转)
a98709474：
MYSQL分库分表总结
CatchU： 7年前的招聘要求，厉害厉害
面试要求
luozhixiong： <table class="bbcode&qu ...
MYSQL分库分表总结
沈寅麟：好用
freemarker格式化

用jquery实现输入框消失文字

博客分类：

网站前台

阅读更多

<html>
<head>
    <title>用jquery实现输入框消失文字</title>
    <style type="text/css">
        .default {
            font-weight: bold;
            color: #787878;
        }
    </style>
    <script type="text/javascript" src="/js/jquery/jquery-1.8.1.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#keywords").focus(function () {
                var $this = $(this);
                if ($this.val() == $this[0].defaultValue) {
                    $this.css("color","#0cf").val("");
                }
            }).blur(function () {
                var $this = $(this);
                if ($this.val() == "") {
                    $this.removeAttr("style").val($this[0].defaultValue);
                }
            })//keywords
        });
    </script>
</head>
<body>
<div id="content">
    <form method="POST" id="user" action="">
        User Name:<input type="text" id="keywords" class="default" name="keywords" value="Enter your name"/><br/>
        PassWord:<input type="text" id="password" class="default" name="password" value="Enter your password"/>
        <input type="submit" name="sub" value="login"/>
    </form>
</div>
</body>
</html>

查看图片附件

分享到：

“回到顶端”按钮实现 | 垃圾站

2013-04-28 16:12
浏览 2071
评论(0)
分类:移动开发
查看更多

评论

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

用jquery实现输入框获取焦点消失文字: 总结来说，使用jQuery实现输入框获取焦点消失文字的功能，能够提升网页的交互性，使用户更容易理解输入框的预期用途。通过适当的优化，可以克服一些初始实现中的限制，提供更优秀的用户体验。在实际开发中，不断关注...

jQuery插件EnPlaceholder实现输入框提示文字: jQuery插件EnPlaceholder是一款用来为网页中的输入框添加提示文字功能的JavaScript插件。它允许开发者在HTML5的placeholder属性尚未被支持的浏览器中模拟这一功能，并且还扩展了此功能，可以应用于密码输入框。该...

html5配合css3实现带提示文字的输入框: 为了创建带有提示文字的输入框，我们可以使用`placeholder`属性。这个属性允许我们在输入框内设置一段淡色的文本，当用户聚焦或输入内容时，这段文本会自动消失。以下是一个简单的HTML代码示例： ```html <!DOCTYPE...

jQuery实现的文本框输入文字后飞出消失动画效果源码.zip: 这个"jQuery实现的文本框输入文字后飞出消失动画效果源码.zip"压缩包文件，显然包含了一个特定的功能实现，即在用户在文本框（input[type="text"]）中输入文字后，这些文字会以飞出消失的动画效果呈现。这种效果通常...

jquery文本框显示描述文字rar: 在本主题中，我们关注的是一个特定的jQuery特效：在文本框（input）中显示描述文字，当用户开始输入时这些文字会消失。这个功能常见于许多表单设计中，用于提示用户输入内容的类型或者格式，提供更好的用户体验。 ...

获取输入框内容设置输入框默认提示js插件: 使用这个插件，开发者可以通过简单的API调用来实现输入框的动态交互，例如初始化插件、监听输入框内容变化，或者改变默认提示。在实际应用中，这可以提升用户在填写表单时的体验，特别是在需要输入大量信息的场景下...

jQuery实现IE输入框完成placeholder标签功能的方法: 标题中的“jQuery实现IE输入框完成placeholder标签功能的方法”指的是在Internet Explorer（特别是低版本如IE8及以下）中，由于这些版本不支持HTML5的`placeholder`属性，因此需要使用jQuery来模拟这一功能。...

jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例: 文章主要介绍了如何使用jQuery来实现当input输入框获得和失去焦点时，提示信息的显示和隐藏。首先，对于不熟悉jQuery的读者，需要理解jQuery是一个快速、小巧、功能丰富的JavaScript库。它通过封装JavaScript常用的...

jQuery实现的用户注册表单上方弹窗提示文字特效源码.zip: 在注册表单中，我们可以使用jQuery选择器来精确地定位到表单元素，如输入框、按钮等，然后绑定相应的事件处理函数，如`click`或`submit`。对于表单验证，jQuery提供了丰富的功能来检查用户输入的有效性。例如，...

jQuery输入文字弹幕显示动画特效.zip: 《jQuery输入文字弹幕显示动画特效》是一款基于JavaScript库jQuery实现的创新互动特效，它允许用户在限定的10个字符内输入个性化文字，并以弹幕形式动态展示出来，为网页增添趣味性和交互性。这一特效尤其适用于社交...

jquery表单文本框添加文字标签.zip: 本教程将聚焦于如何使用jQuery在表单文本框中添加文字标签，这一功能对于提升用户界面的易用性和可读性至关重要。首先，我们需要理解HTML5中的`<input>`元素，这是创建表单文本框的基础。例如，一个基本的文本...

asp.net输入框特效: 4. **水印效果**：在输入框未被填写时显示提示文字，一旦用户开始输入，提示文字会消失。可以使用JavaScript或者jQuery插件实现。 5. **输入限制**：限制输入框能接受的字符类型或长度，例如只允许数字、字母，或者...

input 标签实现输入框带提示文字效果(两种方法): 如果需要实现跨浏览器兼容性，可以使用JavaScript库，如jQuery，来检测输入框的状态并动态显示或隐藏提示文字。以下是一个简单的例子： ```javascript $(document).ready(function() { $("#focus .input_txt")....

jquery文字输入特效.zip: 例如，我们可以使用`$("#inputId").val()`来获取或设置输入框的值，`$("#inputId").focus()`则可以实现焦点切换，这些是构建文字输入特效的基础。接下来，我们来看如何创建一个简单的文字输入提示效果。这通常用于...

jQuery实现表单input中提示文字value随鼠标焦点移进移出而显示或隐藏的代码: 为了提高用户体验，经常会在表单的输入框（`input`元素）内预设提示性文字，这些文字在用户未输入时显示，一旦用户聚焦输入框开始输入，提示文字应自动消失。jQuery是一个广泛使用的JavaScript库，它简化了DOM操作和...

H5 输入框的提示信息: 如上例所示，`placeholder="请输入您的姓名"`会在输入框内显示“请输入您的姓名”，当用户开始输入或者聚焦在输入框时，该提示信息会自动消失。 2. CSS样式调整有时我们可能需要自定义提示信息的样式，可以通过CSS...

掩盖输入样式的漂亮的jquery登陆页面: 在描述中提到的“鼠标定位到输入框中，默认提示的文字消失”，这通常通过JavaScript或者jQuery的事件监听功能来实现，比如`focus`事件。当用户聚焦到输入框时，触发相应函数，清除或改变文本内容。而“或者移动到...

jQuery实用小技巧_输入框文字获取和失去焦点的简单实例: 在本文中，我们将深入探讨jQuery中的实用小技巧，特别是关于输入框文字的获取和失去焦点时的处理。这个实例展示了如何在用户与输入框交互时动态改变文本内容，以提供更好的用户体验。首先，我们看到HTML代码包含了...

Global site tag (gtag.js) - Google Analytics