<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>input test</title>
<script type="text/javascript"
src="jquery-1.10.2.js"></script>
<script type="text/javascript">
function inputTipText(){
$("input[class*=grayTips]") //所有样式名中含有grayTips的input
.each(function(){
var oldVal=$(this).val(); //默认的提示性文本
$(this)
.css({"color":"#888","font-size":"14px","font-weight":"bold"}) //灰色
.focus(function(){
if($(this).val()!=oldVal){$(this).css({"color":"#000","font-weight":"normal"})}else{$(this).val("").css({"color":"#888"})}
})
.blur(function(){
if($(this).val()==""){$(this).val(oldVal).css({"color":"#888"})}
})
.keydown(function(){$(this).css({"color":"#000","font-weight":"normal"})})
})
}
$(function(){
inputTipText(); //直接调用就OK了
})
</script>
</head>
<body>
<input type="text" value="输入您的用户名" class="grayTips" />
<input type="text" value="输入您的登录密码" class="grayTips"/>
</body>
</html>
分享到：
相关推荐
用JavaScript实现，在表单的文本框中添加提示信息有助于理解表单的内容和目的。
Hint通常指的是在文本框内显示的临时性提示信息，它不是WPF标准控件的一部分，但可以通过自定义样式或者使用附加属性来实现。例如，可以创建一个附加属性`Hint`，并在控件的样式中检查这个属性的值，根据需要显示或...
当文本框为空时，会显示一条提示信息，一旦用户开始输入或文本框获得焦点，提示信息会自动消失。这种功能在许多应用中都能见到，例如登录界面的用户名和密码字段。 在提供的资源中，"InfoTextBox.cs"可能是自定义的...
对于“自动在文本框提示信息”，我们通常指的是当用户聚焦到文本输入框时，显示一段预设的提示文本，而当用户开始输入时，这个提示文本会自动消失或者改变。 实现这一功能，首先需要在HTML中设置一个文本输入框，并...
本教程将深入探讨如何创建一个自定义的文本框提示组件，该组件在用户点击文本框后能显示相关提示信息。我们将主要关注以下几个方面： 1. **组件基础**：首先，我们需要了解AS3中的组件基础。组件通常继承自...
JavaScript鼠标点到文本框时的提示信息 JavaScript鼠标点到文本框时的提示信息 JavaScript鼠标点到文本框时的提示信息
这种设计主要用于引导用户输入信息，通过在文本框内预设一些提示性文字，来帮助用户理解该输入区域的目的。例如，一个搜索框可能会显示“请输入标题搜索”，当用户点击文本框或者按下键盘时，这些提示文字会自动消失...
在许多场景下，为了提高用户体验和明确输入要求，设计师和开发者会在`input`文本框内显示提示信息。这种提示信息通常是非强制性的，旨在指导用户如何填写或提醒他们应输入何种内容。当用户鼠标点击文本框时，这些...
标题中的“文本框输入提示信息”通常指的是在用户界面（UI）设计中，为了帮助用户更好地理解输入字段的用途或格式要求，所显示的一种辅助性文字。这些提示信息会在文本框为空或者用户聚焦前处于可见状态，一旦用户...
首先设置`Text`属性为提示信息，在文本框获得焦点时清空`Text`，失去焦点时如果`Text`为空则重新显示提示信息。 ```csharp private void textBox_GotFocus(object sender, EventArgs e) { if (textBox.Text == "请...
文本框提示是一种在用户将光标置于文本框上方时显示提示信息的技术。这种方式可以有效地向用户展示输入要求或格式，减少错误输入的概率。 **实现原理：** 1. **HTML结构设置：** 首先需要为文本框添加`onfocus`和`...
### JavaScript 实现文本框提示知识点解析 #### 一、背景介绍 在网页开发过程中，为了提升用户体验，常常需要对用户输入进行即时反馈。其中一种常见的做法就是在用户将光标聚焦到某个输入框时，通过弹出提示的方式...
- **气泡提示**：另一种常见方式是使用`JOptionPane`或者自定义的提示窗口，在文本框附近显示匹配的提示信息。这种提示通常会在用户停止输入一段时间后消失。 4. **JAutoComplete库**： 如果不希望手动实现整个...
在iOS开发中，文本框...通过以上步骤，你可以实现一个功能完善的自动提示文本框，它不仅能提供文字提示，还可以支持图片等多种形式的提示信息。在实际应用中，可以根据具体需求进行调整和优化，提高用户体验。
另一种是使用label标签与输入框层叠显示提示文字，类似点点网的做法，这样即便JavaScript代码没有生效，用户仍然可以看到提示信息，并在掩码输入框中输入密码。 在设计登录页面时，如果确实需要针对密码输入框提供...
如何让文本框内的提示信息在激活文本框时清空 解决思路： 当需要填写的文本框很多时，在每个文本框内写上提示信息是个不错的办法，但这样一来用户在填写该项时必须先把提示文本删掉，非常不方便。所以应该让文本框更...
在ASP.NET开发中，我们经常需要为用户界面提供友好的提示信息，比如在文本框（TextBox）中显示默认的提示文字。这样的功能可以提高用户体验，因为它在用户输入前提供了清晰的指引。本篇文章将深入探讨如何在ASP.NET...
在这个案例中，我们探讨的是如何使用Ajax来实现一个文本框输入时的提示功能，这些提示信息是从数据库动态获取的。 首先，我们需要在前端创建一个文本框，用户在此输入信息时，会触发Ajax请求。HTML代码可能如下： ...
【Ajax文本框输入提示】是一种前端交互技术，用于在用户输入文本时实时提供相关的建议或提示信息。在网页设计中，这种功能可以显著提升用户体验，尤其是对于搜索框或需要输入特定信息的表单。这个例子是基于Java和...
这可以是一个数组集合，包含字符串或其他对象，每个对象包含提示文本和其他相关信息。 2. **监听键盘事件**：使用`TextInput`组件的`keyUp`事件，当用户停止按键时触发提示逻辑。 3. **匹配输入**：比较用户输入的...