您好,欢迎访问一九零五行业门户网

文本框(input)获取焦点(onfocus)时样式改变的示例代码_javascript技巧

摘要:许多重视用户体验的设计师都希望给文本框(input)加上获取焦点或者鼠标悬停时的样式切换效果。其实很简单,我们只需要获取页面上的文本框,加上onfocus事件或者其他对应的事件即可。本文介绍了如何在获取焦点时切换样式,明白原理后,实现其他效果就很简单了。
许多重视用户体验的设计师都希望给文本框(input)加上获取焦点或者鼠标悬停时的样式切换效果。其实很简单,我们只需要获取页面上的文本框,加上onfocus事件或者其他对应的事件即可。本文介绍了如何在获取焦点时切换样式,明白原理后,实现其他效果就很简单了。
复制代码 代码如下:
function focusinput(focusclass, normalclass) {
           var elements = document.getelementsbytagname(input);
              for (var i=0; i                  if (elements[i].type != button && elements[i].type != submit && elements[i].type != reset) {
                 //if(elements[i].type==text){
                   elements[i].onfocus = function() { this.classname = focusclass; };
                   elements[i].onblur = function() { this.classname = normalclass||''; };
                }
             }
        }        window.onload = function() {
            focusinput('focusinput', 'normalinput');
        }
复制代码 代码如下:
其它类似信息

推荐信息