关于JavaScript的样式转换问题
border-style:solid;border-width:1px;}.textonmouseout{border-color:black;border-style:...
border-style:solid;
border-width:1px;
}
.textonmouseout{
border-color:black;
border-style:solid;
border-width:1px;
}
.btnmouseover{
background-image:url(back2.jpg);
border:0px;
margin:0px;
padding:0px;
}
.btnmouseout{
background-image:url(back1.jpg);
border:0px;
margin:0px;
padding:0px;
}
</style>
</head>
<body>
<form action="" method="post" name="myform">
<table align="center">
<tr><td>账号<input type="text" class="textonmouseout" onMouseOver="this.className='textonmouseover'" onmouseout="this.className='textonmouseout'"></td></tr>
<tr><td>密码<input type="password" class="textonmouseout" onmouseover="this.className='textonmouseover'" onmouseout="this.className='textonmouseout'"></td></tr>
<tr><td colspan="2"><input type="button" name="button" style="background:url(back1.jpg); width:83px; height:23px; margin:0px; border:0px; padding:0px" onMouseOver="this.className='btnmouseover'" value="登陆"></td></tr>
</table>
</form>
</body>
</html>
我想知道这段代码为什么onmouseover会无效~~ 展开
border-width:1px;
}
.textonmouseout{
border-color:black;
border-style:solid;
border-width:1px;
}
.btnmouseover{
background-image:url(back2.jpg);
border:0px;
margin:0px;
padding:0px;
}
.btnmouseout{
background-image:url(back1.jpg);
border:0px;
margin:0px;
padding:0px;
}
</style>
</head>
<body>
<form action="" method="post" name="myform">
<table align="center">
<tr><td>账号<input type="text" class="textonmouseout" onMouseOver="this.className='textonmouseover'" onmouseout="this.className='textonmouseout'"></td></tr>
<tr><td>密码<input type="password" class="textonmouseout" onmouseover="this.className='textonmouseover'" onmouseout="this.className='textonmouseout'"></td></tr>
<tr><td colspan="2"><input type="button" name="button" style="background:url(back1.jpg); width:83px; height:23px; margin:0px; border:0px; padding:0px" onMouseOver="this.className='btnmouseover'" value="登陆"></td></tr>
</table>
</form>
</body>
</html>
我想知道这段代码为什么onmouseover会无效~~ 展开
展开全部
首先你的思路是正确的，在IE中是的确有效的。但CSS定义是有顺序的，后定义的要覆盖掉先定义的。还有一种情况特殊。内置定义永远是不能被其他的所覆盖，也就是在<input>内存在style属性时，用javascript是不能再将其覆盖的，其实，它实际上也是执行了，但后来又被这个属性覆盖掉了，既然你定义的有onmouseout，为什么不使用class=onmouseout呢？还为什么要重新再在标签内重定义呢？这很明显也不符合你的初衷的！
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<input type="button" name="button" style="background:url(back1.jpg); width:83px; height:23px; margin:0px; border:0px; padding:0px" onMouseOver="this.className='btnmouseover'" value="登陆">
可以改为：
<input type="button" name="button" style="btnmouseout" onMouseOver="this.className='btnmouseover'" onmouserout="this.className='btnmouseout'" value="登陆">
可以改为：
<input type="button" name="button" style="btnmouseout" onMouseOver="this.className='btnmouseover'" onmouserout="this.className='btnmouseout'" value="登陆">
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
因为楼主没有定义这个CSS样式呀!!
'textonmouseover'
楼主仔细看看;
祝楼主早日成功!
'textonmouseover'
楼主仔细看看;
祝楼主早日成功!
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
