廢話不多說了，直接給大家貼關鍵代碼了，具體代碼如下所示：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title> new document </title><meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /><link rel="stylesheet" type="text/css" href="" /><style type="text/css">.box{width:1000px;margin:0 auto;height:500px;border:1px solid green;}.tbox{width:150px;height:30px;border:1px solid #585858; margin:10px 10px;background-color:#eee;vertical-align:middle;background: url(re_code2.png) no-repeat #EEE 8px 8px;background-size: 15px;}.ptes{width:115px;height:30px;}.tbox1{width:150px;height:30px;border:1px solid red; margin:10px 10px;}.pb1:hover {background-color:#eee;vertical-align:middle;background: url(re_code1.png) no-repeat #EEE 8px 8px;background-size: 15px;}</style><script type="text/javascript"></script></head><body style="background-color:#FFF;"><div><div onmouseout="this.className='tbox'" onmousemove="this.className='tbox1 pb1'"><div style="float: left; width:30px; height:30px;"></div><div style="float: left;"><input id="password" name="password" type="password" placeholder=" 請輸入密碼" value=""/></div></div><div></body></html>以上所述是小編給大家介紹的分享JS代碼實現鼠標放在輸入框上輸入框和圖片同時更換樣式，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對武林網網站的支持！