我这里有什么地方不对吗?
<!DOMTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>js编程练习</title> <!--css begin--> <style type="text/css"> *{margin: 0 ; padding: 0; font-family: "宋体"} #main{ border: 2px solid red; height: 100%;} #showmore{ position: absolute; top: 5%; left: 25%; border-top: 1px solid blue; border-right: 1px solid blue; border-left: 1px solid blue; background: white; width: 400px; } </style> <!--css end--> <!--这是内部JS代码--> <script type="text/javascript"> //光标失焦 function showOnblur() { var sob = document.getElementById("showmore");//通过id获取 sob.style.display = "none";//隐藏内容 } //光标聚集 function moreOnfocus() { var mof = document.getElementById("showmore"); mof.style.display = "block"; //显示内容 } </script> <!--内部js end--> </head> <body> <div id="main"> <p id="mainp" >简介:做为WEB攻城师必备技术JavaScript, 本课程从如何插入JS代码开始,学<span id="more1" onfocus="moreOnfocus()" >[更多]<span></p> <div id="showmore" onblur="showOnblur()" >简介:做为W EB攻城师必备技术JavaScript,本课程从如何插入JS代码开始, 学习JS基础语法、语法、函数、方法等,让你掌握JS编程思路、 知识的使用等,实现运用JS语言为网页增加动态效果,达到与 用户交互的目的。</div> </div> </body> </html>
为什么#showmore的内容没有隐藏。。。