一聚教程网：一个值得你收藏的教程网站

ps教程 | flash教程 | 路由器设置 | Jsp教程 | 加入收藏

PHP教程 Css教程 操作系统 数据库

首页 php教程 asp.net教程 css教程 网页制作 网页特效 手机开发 办公数码
当前位置：一聚教程网 > 网页制作 > jquery

推荐专题

最新下载

热门教程

JavaScript中文本框焦点时边框变色

时间：2014-08-29 编辑：简简单单 来源：一聚教程网

JavaScript中文本框焦点时边框变色
例子

 代码如下 复制代码

function   appendit() 
  { 
  var   nodes   =   document.getElementsByTagName("INPUT"); 
  for   (var   i=0;   i   { 
  var   ctype   =   nodes[i].getAttribute("type"); 
  if   (ctype   ==   'text') 
  { 
  nodes[i].onfocus   =   function   ()   {   this.style.backgroundColor='#33FF00';   } 
  nodes[i].onblur   =   function   ()   {   this.style.backgroundColor='#3366FF';   } 
  } 
  } 
  } 

测试：


再看一个例子

点击边框变色的文本框，鼠标点击文本框将要输入的时候，文本框自动变色高亮显示，非常有视觉效果，让文本框变漂亮了许多

 代码如下 复制代码





输入框点击时边框变色效果




请输入姓名：

在火狐下也有效，只不过火狐和chrome下，这两款浏览器默认会自动会输入框添加点击效果，所以有时候看不清，IE下表现突出。


把现在流行的基于jquery实现方法给各位介绍一个例子

 代码如下 复制代码

Html code:

  

文本框聚焦清空默认值边框变色，离开焦点添加默认值

  

              

              

              

              

                      

              

              

  

Css code

:

这个是基于jquery库的啊，请自己加上啊。

 代码如下 复制代码

Js  code:

相关文章

热门栏目

一聚教程网| 关于我们| 联系我们| 广告合作| 友情链接| 版权声明

copyRight@2007-2024 www.111COM.NET AII Right Reserved 苏ICP备17065847号-2

网站内容来自网络整理或网友投稿如有侵权行为请邮件:yijucomnet@163.com 我们24小时内处理