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

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

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

<!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>

提问者：侦探 2015-11-26 11:10

个回答

一只特立独行的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>

长颈鹿在附近: 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>

你要的应该是这种效果吧

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" 调用函数得有括号
0
李晓健

2015-11-26 12:57:36

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

1