javascipt设置缴活表单时的样式

本文分享了一段JavaScript代码示例,该代码能够在用户聚焦(input)和失去焦点时改变输入框的颜色,适用于表单中的input和textarea元素,有助于提升用户体验。

 还是在同事那里看到的。其实以前也看过。但一直都没想到做一次试试。这次是下班的时候那个同事回家了。于是我被头逮着去改他的代码。于是发现了这个代码。感觉很很好。于是拿来做笔记。与这里的大虾们也分享一下我的小收获。

 

<SCRIPT type=text/javascript>
                
var form1 = document.getElementById("form1");//input
                var form1Input = form1.getElementsByTagName("input");
                
for(i=0; i<form1Input.length; i++){
                    form1Input[i].onfocus 
= function(){
                        
this.style.backgroundColor = "#FFC";
                    }

                    form1Input[i].onblur 
= function(){
                        
this.style.backgroundColor = "";
                    }

                }

                
                
var form1textarea = form1.getElementsByTagName("textarea")[0];//textarea
                form1textarea.onfocus = function(){
                    
this.style.backgroundColor = "#FFC";
                }

                form1textarea.onblur 
= function(){
                    
this.style.backgroundColor = "";
                }

</SCRIPT>

 

使用的时候加在尾部或表单后面都可以。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值