JavaScript 鼠标移动,样式改变文本框边框颜色
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JavaScript 鼠标移动,样式改变文本框边框颜色相关的知识，希望对你有一定的参考价值。
只需要鼠标移动该表边框的颜色
<script type="text/javascript">funcation changecolor()
document.getElememtById("mytext").style.bodercolor="red";
<script>
<body>
<input type="text" value="aaa" id="mytext" onmouseover="changecolor()"/>
<body> 参考技术A 用Jquery吧 实现起来很简单追问
那怎么弄呢？帮帮忙了
追答先去下载一个就query：http://jquery.com/ --附件里面有
<html><head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(function()
$("input[type=text]").mouseenter(function()
color=$(this).css('border-color');
$(this).css('border-color','red');
).mouseleave(function()
$(this).css('border-color',color);
);
);
</script>
</head>
<body>
<input type="text" value="123"/>
<input type="text" value="wq"/>
<body>
</html>
var s = document.getElementById('s');
s.style.borderColor = '#FFF000';
);追问
亲，能给我完整的代码吗？
追答啊，这还不完整，s就是要改变边框的id
js验证非空后，输入框边框变红，如果输入正确怎么让边框恢复到默认的颜色？
验证与恢复函数我会写，就是不知道输入框默认的是什么样式，
function restore(a)
a.style.border="1px solid black";
默认的样式不是黑色也不是白色，到底该怎么恢复到原来的样子？
下面那条线不是，上面那个输入框就是输入标签的默认的样式
默认的边框样式应该是无法恢复的，不同浏览器的边框也不一样。
不过你可以在文本框外面加一个span，只改变span的边框（需要调整一下padding），这样就可以恢复了：
<html><head>
<script type="text/javascript">
var t = 0;
function showBorder()
var answer3 = document.getElementById("yearId").value;
if (t == 0)
t = 1;
document.getElementById("yearId").parentElement.style.border = "0";
else
t = 0;
document.getElementById("yearId").parentElement.style.border = "1px solid black";
</script>
</head>
<body>
<span style="padding-bottom: 2px; padding-top: 1px; padding-left: 0; padding-right: 0">
<input type="text" id="yearId" name="yearId" size="16" /></span>
<input type="button" value="show border" onclick="showBorder()" />
</body>
</html>
效果图：
以上是关于JavaScript 鼠标移动,样式改变文本框边框颜色的主要内容，如果未能解决你的问题，请参考以下文章