js实现文本框中内容的放大显示
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>文本框放大</title>
<script>
function $(id){
return document.getElementById(id);
} function showBigInfo(obj){
var bigObj;
if(!$("bigInfo")){
bigObj=document.createElement("span");
bigObj.setAttribute("id","bigInfo");
bigObj.style.position="absolute";
bigObj.style.border="1px solid #F93";
bigObj.style.borderRadius="2px";
bigObj.style.color="red";
bigObj.style.fontSize="26px";
bigObj.style.fontWeight="bold";
bigObj.style.padding="4px";
bigObj.style.display="none";
document.body.appendChild(bigObj);
obj.onblur=function(){
$("bigInfo").style.display="none";
}
obj.onfocus=function(){
$("bigInfo").style.display="block";
}
}else{
bigObj=$("bigInfo");
}
bigObj.style.display="block";
var str="";
var info=obj.value;
for(var i=;i<info.length;i+=){
str+=info.substr(i,)+" ";
}
bigObj.innerHTML=str;
if(obj.offsetTop<){ //放大框在下方显示
bigObj.style.top=(obj.offsetTop+obj.offsetHeight+)+"px";
}else{ //放大框在上方显示
bigObj.style.top=(obj.offsetTop-bigObj.offsetHeight-)+"px";
}
bigObj.style.left=(obj.offsetLeft+obj.offsetWidth/-bigObj.offsetWidth/)+"px";
}
</script>
</head> <body>
<br /><br /><br /><br /><br /><br />
<center> 请输入身份证号码:<input type="password" onKeyUp="showBigInfo(this)" maxlength="" size=""/>
<br />
请输入身份证号码:<input type="password" onKeyUp="showBigInfo(this)" maxlength="" size=""/>
<br />
请输入身份证号码:<input type="password" onKeyUp="showBigInfo(this)" maxlength="" size=""/> </center>
</body>
</html>
js实现文本框中内容的放大显示的更多相关文章
- JS控制文本框中的密码显示/隐藏功能
<html> <head> <title>[荐]JS控制文本框中的密码显示/隐藏功能_网页代码站(www.6a8a.com)</title> <s ...
- js数据显示在文本框中(页面加载显示和按钮触动显示)
web代码如下: <!DOCTYPE html> <html> <head> <title>jsTest02.html</title> &l ...
- 用js检测文本框中输入的是否符合条件并有错误和正确提醒
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 用js判断文本框中的是不是空,是否有空格
<script type="text/javascript"> function checkRoleName(){ var userName=document.getE ...
- C#.NET常见问题(FAQ)-如何让文本框textbox内容靠右显示
对于TextBox,我可以设置Text-Align属性为right,就可以让文字靠右了 对于Label而言,需要修改AutoSize为False,并修改TextAlign为MiddleRight, ...
- js限制文本框只能输入数字方法小结(转)
这篇文章主要分享下js代码限制文本框中只能输入数字的多个实例,学习下js控制文本框中输入数字的方法,需要的朋友可以参考下 有时需要限制文本框输入内容的类型,本节分享下正则表达式限制文本框只能输入数 ...
- Js控制显示、隐藏文本框中的密码
Js控制显示.隐藏文本框中的密码,也可称为是一款小型的JavaScript星号密码破解器,点击会显示出密码类型的文本框中的真实信息,再次点击则还原,程序 主要是获取HTML元素对象,然后强制更改元素属 ...
- DEV中dx:ASPxPopupControl 控件的使用(在窗口关闭或隐藏时,清楚文本框中的内容)
//在窗口关闭或隐藏时,清楚文本框中的内容(核心代码) function(s, e) { ASPxClientEdit.ClearGroup('entryGroup'); } <asp:Cont ...
- 第二十七篇 -- 如何给静态文本设置成ico图标形式以及如何修改文本框中的内容
修改静态文本框内容: CWnd* pWnd = GetDlgItem(IDC_STATIC1); pWnd->SetWindowText(_T("Server is on!" ...
随机推荐
- [Java入门笔记] 面向对象编程基础(二):方法详解
什么是方法? 简介 在上一篇的blog中,我们知道了方法是类中的一个组成部分,是类或对象的行为特征的抽象. 无论是从语法和功能上来看,方法都有点类似与函数.但是,方法与传统的函数还是有着不同之处: 在 ...
- linux命令:ls
命令格式: ls [OPTION]... [FILE]... 功能: 列出某个目录下的文件信息,默认列出当前目录.输出结果默认按字母顺序排列. 参数: -a, --all,-A, --almost-a ...
- 使用本地JConsole监控远程JVM(最权威的总结)
问题背景 Tomcat经常崩溃crash,想看看JVM内存使用情况,就想到了用Jconsole监控,以前只是监控本地的JVM,这次要监控远程的,遇到了不少问题. 经过几个小时的努力,参考了众多 ...
- hdfs client access the hdfs cluster not in one domain
https://hadoop.apache.org/docs/stable/hadoop-project-dist/hadoop-hdfs/HdfsMultihoming.html#Clients_u ...
- MMORPG大型游戏设计与开发(服务器 游戏场景 掉落与网络连接)
时间一点点的消逝,伴着自己空闲日子将要结束的时候我尽量的学习和分享场景和AI的知识给朋友们,不过很遗憾的是这些文章还有不足的地方,就是有的难点没有完全的分析到.掉落在游戏中必不可少的,同时网络连接也是 ...
- Python 数据类型及其用法
本文总结一下Python中用到的各种数据类型,以及如何使用可以使得我们的代码变得简洁. 基本结构 我们首先要看的是几乎任何语言都具有的数据类型,包括字符串.整型.浮点型以及布尔类型.这些基本数据类型组 ...
- 开放api接口签名验证
不要急,源代码分享在最底部,先问大家一个问题,你在写开放的API接口时是如何保证数据的安全性的?先来看看有哪些安全性问题在开放的api接口中,我们通过http Post或者Get方式请求服务器的时候, ...
- Selenium-java-TestNg-的运行
package com.day.www; import org.testng.annotations.AfterClass;import org.testng.annotations.AfterMet ...
- iis
IIS架构 1. 概述 为了提高IIS的可靠性,安全性以及可用性,与IIS5.0和以前更早的版本不同,IIS6.0提供了一个全新的IIS架构.这个架构的详细情况如下图所示: ...
- C# ASP.NET 优化程序性能、降低内存使用、提高程序运行速度
首先纪念一下今天的股票大跌抓个图,虽然我自己损失不是很大,但是应该大多人都损失不小.也可能有人会继续跳楼,也可能是股市一个新的转折点来了. 接着还是重点关注自己写代码优化的主题吧.软件系统当访问量不大 ...