为何鼠标移到标签上不变色-慕课网

首页课程实战体系课手记专栏慕课教程

为何鼠标移到标签上不变色

来源：6-3 鼠标经过事件（onmouseover）

侦探

2015-11-26 11:10

<!DOCTYPE HTML>

<html>

<head>

<title> 鼠标经过事件 </title>

function message(){

confirm("请输入密码后，再单击确定!");

}

function click(){

var mychar =document.getElementsByName("title")[0];

mychar.style.color="red";

}

</script>

</head>

<body>

<form>

</form>

</body>

</html>

写回答关注

4回答

一只特立独行的doge: 2016-04-20 13:05:21

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> 鼠标经过事件 </title>
<script type="text/javascript">
    function message(){
  confirm("请输入密码后，再单击确定!"); 
     }
     function colChange(){
        var mychar =document.getElementsByName("title")[0];
        mychar.style.color="red";
     }
</script>
<style>
  .form1{width:300px;height:300px;margin:0 auto;test-align:center;background-color:#003;}
  .form2{width:200px;height:200px;margin:0 auto;test-align:center;background-color:#666;}
</style>
</head>
<body>
<!--<form class="form1">
<label name="title" style="color:black">密码:</label>
<label name="title" style="color:black">密码:</label>
<input name="password" type="password" onmounseover="colChange()"/>
<input name="确定" type="button" value="确定" onmouseover="message()"/>
</form>-->
<form class="form2">
<label name="title" style="color:black">密码:</label>
<label name="title" style="color:black">密码:</label>
<input name="password" type="password" onmouseover="colChange()"/>
<input name="确定" type="button" value="确定" onmouseover="message()"/>
</form>
</body>
</html>

0 0

长颈鹿在附近: 2016-02-28 11:30:04

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title> 鼠标经过事件 </title>

<script type="text/javascript">

    function message(){

  confirm("请输入密码后，再单击确定!"); 

     }

     function putate(){

         var mychar =document.getElementById("title");

         mychar.style.backgroundColor="red";
     }

</script>

</head>

<body>

<form>

<p>密码:</p>
<input id="title" name="password" type="password" onmouseover="putate()"/>
 
<input name="确定" type="button" value="确定" onmouseover="message()"/>


</form>

</body>

</html>

你要的应该是这种效果吧

0 0

zeroweb

2015-12-22 15:14:41
<script type="text/javascript">
function message(){
confirm("请输入密码后，再单击确定!");
}
function clicks(){
var mychar = document.getElementsByName("title")[0];
mychar.style.color="red";
}
</script>
<form>
<label name="title" style="color:black">密码:</label>
<label name="title" style="color:black">密码:</label>
<input name="password" type="password" onmouseover="clicks()" >
<input name="确定" type="button" value="确定" onmouseover="message()"/
</form>
经测试没有问题
你的问题
1. click属性名不可当作函数名来用我改成clicks
2. 你用到的“getElementsByName”不能单个使用
  看例子：http://www.w3school.com.cn/jsref/met_doc_getelementsbyname.asp
  我复制了一个就可以获取到第一个name值为title的元素了
3. 你这里的问题 onmounseover="click" 调用函数得有括号
1 0

一只特立独行...

哥们，我就懵了逼了，我照着你写的，一模一样。。。我的就不行，你的就行，能不能帮我看看啊！一脸大写的懵逼吧。form1是我的，form2是你的。代码贴不出来，我贴楼下！你看看

2016-04-20 13:04:32

共 1 条回复 >
李晓健

2015-11-26 12:57:36

style="color:balck" 你这个black 写错了这里和你的程序没有关系
onmounseover="click" 这里click后面没有加括号
input好像不会触发 onmounseover 事件，所以就算程序都写对也没有用

0 1

JavaScript进阶篇

本课程从如何插入JS代码开始，带您进入网页动态交互世界

468194 学习 · 21891 问题

查看课程

相似问题

鼠标移动变色问题

回答 2

鼠标移到不同行时背景色改变？

回答 1

鼠标移动变色的问题

回答 3

这样写为什么鼠标移动到一行上颜色不改变？

回答 1

为什么鼠标移动颜色没变化？

回答 2

打开慕课网App查看更多内容