本文给出了一个js实现输入框文本动态转换和显示效果的实例。分享给大家参考。具体如下：

这里演示js在INPUT框中实现特殊的显示效果。有些词慢慢交替显示，最后显示完整的词。要显示的单词预先保存在数组中，依次调用和显示。是不是很有趣？

运行效果截图如下：

在线演示地址如下：

http://demo.jb51.net/js/2015/js-input-txt-rand-show-codes/

具体代码如下：

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www . w3 . org/TR/XHTML 1/DTD/XHTML 1-Transitional . DTD ' html xmlns=' http://www . w3 . org/1999/XHTML ' hearteta http-equiv=' Content-Type ' Content=' text/html；charset=GB 2312 '/title输入文本特殊显示/title/head body bgcolor=' # ffffff ' on load=' start quote()；'SCRIPT LANGUAGE='JavaScript '！-Beginva quotes tr；var quoteNumvar quoteDisvar quoteLenvar quoteLocvar quotePicvar quoteMaxvar numQuotefuncQuote() {this[0]='你有没有想过在页面的不同地方有不同的鼠标形状，就是这个'；这个[1]='类似蜘蛛网的东西出现在鼠标上，放在文字链接上后会改变'；这个[2]='鼠标上的摇球很新颖，你会喜欢的，很酷'；这[3]='鼠标右键弹出导航栏，导航栏上有背景变化，很有新意，很酷'；这个[4]='双击鼠标页面向下滚动，点击鼠标页面停止滚动，非常实用'；这[5]='鼠标周围旋转的宣传文字是很酷的效果，一定不能错过'；这[6]='将鼠标放在链接上后，状态栏中会显示一大串字符，可用于隐藏链接'；这个[7]='如果用鼠标选择页面上的某个内容，会弹出一个警告框显示所选内容'；这个[8]='在页面上点击鼠标，随意拖动，会显示鼠标在页面上移动的轨迹'；这个[9]='围着鼠标转，跟着鼠标动，自己旋转的宣传词，酷'；这个[10]='跟随鼠标的半透明图片，看起来很酷，可以做阴影效果。}函数getQuote(){ quote len=0；quote loc=0；quote enum=math . floor(math . random()* numQuote)；quote str=make quote[quote enum]；quote len=quote str . length；pad quote()；}函数disQuote(){ quote loc=quote loc 1；if(quote loc quote max){ getQuote()；} quoteDis=quoteStr.substring(0，quote loc)；for(var I=quoteLoc；i quoteMaxvar charonecharone=quoteStr.substring(i，I ^ 1)；var rdnumrdnum=math . floor(math . random()* 57)if(charone！=' '){ quote dis=' ' quote dis quote epic . substring(rdnum，rdnum 1)；} else { quoteDis=' ' quoteDis} } }函数pad quote(){ var space pad=quote max-quote str . length；var front pad=math . floor(space pad/2)；for(var I=0；i frontPadI){ quotes tr=' quotes tr；} for(var I=quote str . length；i quoteMaxI){ quotes tr=' quotes tr '；} }函数loopQuote() { document。randomtext . box 1 . value=quote dis；disQuote()；setTimeout(' Loopquote()；' , 100);}函数startQuote(){ quote str=' '；quote enum=0；quoteDis=quote len=0；quote loc=0；quote epic=' abcdefghjknmopqrstuvwxyzabcedefghjklmnopqrstuvxyz 234567890 '；quoteMax=50numQuote=11make quote=new Funcquote()；getQuote()；disQuote()；loopQuote()；}//end-/script form name=' random text ' input type=' text ' size=' 70 ' name=' box1 '/form/body/html希望本文的描述对大家的javascript编程有所帮助。