<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<style>
/*姓名格式提示信息*/
#passengerNameDiv,
.passengerNameDiv{
position:absolute;
display:none;
}
#passengerNameIframe,
.passengerNameIframe{
position:absolute;
width:168px;
height:48px;
}
#passengerNameNoticeDiv,
.passengerNameNoticeDiv{
position:absolute;
width:168px;
padding:2px 2px;
border:1px solid #7F9DB9;
background:#FFFFFF;
z-index:2;
}
#passengerNameNoticeDiv ul,
.passengerNameNoticeDiv ul{
clear:both;
margin:0pt;
padding:0pt;
}
#passengerNameNoticeDiv ul li,
.passengerNameNoticeDiv ul li{
margin:0pt;
padding:0pt;
float:left;
width:100%;
text-align:left;
font-size:12px;
color:#C0C0C0;
line-height:20px;
}
</style>
</head>
<script language="javascript" type="text/javascript">
function focusPassengerName(textObj){
var textDefault = '所选证件姓名';
if (textObj.value == textDefault){
textObj.value = '';
}
textObj.style.color="black";
var posi = getPositionByObj(textObj);
showHotAirCitys(posi.left,posi.top);
}
function blurPassengerName(textObj){
var textDefault = '所选证件姓名';
if (textObj.value == ''){
textObj.value = textDefault;
textObj.style.color="gray";
}else if(textObj.value == textDefault){
textObj.style.color="gray";
}else{
textObj.style.color="black";
}
hideHotAirCitys();
}
function showHotAirCitys(left,top){
document.getElementById("passengerNameDiv").style.left = left+'px' ;
document.getElementById("passengerNameDiv").style.top = top+'px' ;
document.getElementById("passengerNameDiv").style.display= "block";
}
function hideHotAirCitys(){
document.getElementById("passengerNameDiv").style.display= "none";
}
function getPositionByObj(e){
var t = e.offsetTop;
var l = e.offsetLeft;
var w = e.offsetWidth;
var h = e.offsetHeight;
while(e=e.offsetParent){
t += e.offsetTop;
l += e.offsetLeft;
}
t += h;
return {top: t,left: l,width: w,height: h}
}
</script>
<body>
<input type="text" name="eeeee" /><br>
<input type="text" name="eeeee" /><input type="text" id="test" onfocus="focusPassengerName(this)" onblur="blurPassengerName(this)" value="所选证件姓名" style="color:gray;" /><br/><br/><br/>
<!--姓名格式提示信息 -->
<div id="passengerNameDiv" class="passengerNameDiv">
<IFRAME id="passengerNameIframe" class="passengerNameIframe"></IFRAME>
<div id="passengerNameNoticeDiv" class="passengerNameNoticeDiv">
<ul>
<li>中文姓名 中文字符</li>
<li>英文姓名 last/frist middle</li>
</ul>
</div>
</div>
</body>
</html>
分享到：
相关推荐
这一操作确保了当用户开始输入时，文本将以黑色显示，清晰可辨，与默认的灰色提示信息形成对比。 ### 实现细节 - **事件绑定**：在窗体的设计阶段，需要确保`textBox2_Click`和`Form1_Load`事件与相应的控件正确...
在网页设计和开发中，创建具有默认灰色文本的文本框是一种常见的需求，这通常用于提供提示信息或预填充用户可能需要输入的数据。标题和描述提到的"文本框默认值灰色方法"涉及到使用JavaScript库jQuery来实现这一效果...
另一种是使用label标签与输入框层叠显示提示文字，类似点点网的做法，这样即便JavaScript代码没有生效，用户仍然可以看到提示信息，并在掩码输入框中输入密码。 在设计登录页面时，如果确实需要针对密码输入框提供...
在ASP.NET开发中，我们经常需要为用户界面提供友好的提示信息，比如在文本框（TextBox）中显示默认的提示文字。这样的功能可以提高用户体验，因为它在用户输入前提供了清晰的指引。本篇文章将深入探讨如何在ASP.NET...
"`使得初始显示的“请输入企业名称”文本颜色为灰色，这样用户可以清楚地识别出这是提示信息而不是已输入的内容。 第三，单击后清空提示文字和恢复灰色提示，这部分功能是通过JavaScript实现的。`onfocus`事件在...
- `maxlength`默认设置为140，`speed`设置为15，提示信息样式默认为Arial字体、小号灰色文字，剩余字数为加粗斜体的大号灰色文字。 - 当用户按下键盘时，如果当前输入长度已达最大值且非Backspace或Delete键，将...
在HTML5中，`<input>`标签引入了一个新的属性——`placeholder`，用于在输入框内显示默认的提示信息。然而，这个特性在早期版本的Internet Explorer（IE）浏览器中并不支持，这给开发者带来了兼容性问题。为了确保在...
总结来说，上述代码片段展示了如何通过JavaScript来处理文本框的默认值，它使用了`focus`和`blur`事件来决定何时重置和显示默认文本。这对于构建具有动态交互能力的网页界面非常重要，使得用户在使用表单时能够获得...
当用户点击搜索文本框，开始输入文字后，再移开光标时，文本框内部的光标可能会导致文本位置发生轻微的偏移，有时甚至会使文本框的内容出现不稳定的跳动现象。这通常是由浏览器默认的焦点样式或CSS样式引起的。解决...
在易语言中，编辑框不仅可以用来接收单行或多行文本输入，还可以通过特定方法设置提示文本，即在用户尚未输入任何内容时显示一段灰色的文字，提供操作指南或者默认建议。这种功能在许多应用程序中都有应用，如登录...
文本框（Text Box）是网页设计中不可或缺的元素，它用于收集用户输入的信息。本话题主要探讨一个设计得较为舒适的文本框样式的实现方法。这个样式的关键在于其黄色背景的运用，以及整体的视觉效果和交互体验的优化。...
04153设定、删除单元格的输入规则和信息提示（有效性设置） 04154为单元格设置条件格式、删除条件格式 04155为单元格插入指向工作簿内部的超链接、删除超链接 04156为单元格插入指向工作簿外部的超链接、删除超链接 ...
限定标签提示置于搜索框上方，热门关键词提示放于下方，标示性文字以灰色显示，点击后消失。 - 搜索按钮：通常有图标形式（放大镜）和文字形式，可搭配使用。文字应简洁明了，如“搜索”，避免使用“请输入关键词”...
例如，你可以将“确定”、“取消”等命令性词语设置为按钮的 `Caption`，以便用户理解点击按钮后将发生的操作。 **Cancel 属性**：通过将此属性设置为 `True`，可以使按钮成为默认的取消按钮。这意味着，当用户按下...
帮助信息包括限定标签提示、标示性文字、热门关键词提示等，其中标示性文字可以设置灰色（#cccccc）显示，点击输入框后提示文字消失。 应用场景方面，搜索框可以根据不同的应用场景进行设计，例如强表现方式和弱...
为了提高用户体验，经常会在表单的输入框（`input`元素）内预设提示性文字，这些文字在用户未输入时显示，一旦用户聚焦输入框开始输入，提示文字应自动消失。jQuery是一个广泛使用的JavaScript库，它简化了DOM操作和...
将鼠标悬停在“Unlock”上，会显示一个小提示框，点击`No key bindings`。 6. 在`Binding`后面的文本框中，按下你希望设定的快捷键组合，例如`Ctrl+Shift+L`，然后点击“OK”。 你可以用同样的方法自定义其他SVN...
在编程领域，水印效果通常指的是在用户界面（UI）元素上显示的一种半透明文本，用于提示用户输入信息，而不占用额外的控件空间。在本案例中，我们将讨论如何在PowerBuilder（PB）环境中实现输入框（Text Control）的...