首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >Javascript Mouseover按钮

Javascript Mouseover按钮
EN

Stack Overflow用户
提问于 2016-03-09 21:57:46
回答 1查看 36关注 0票数 0

我想我已经接近正确了,但是我不知道当用户盘旋在它上面时,如何改变我提交按钮的颜色,我也是非常新的javascript,所以任何帮助都会非常感谢。

这是我的代码:

代码语言:javascript
运行
复制
<html>
    <head>
        <title>JavaScript</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script>
            function getName(){
            var name;
            name = window.prompt("Enter your name", "");
            greeting = "User Information for " + name;
            var txt=    document.getElementById('txtWelcome');
            txt.innerHTML=greeting;
            }

    function over() {
            document.getElementById("Submit").style.background  = 'Blue';
        }
        function out() {
            document.getElementById("Submit").style.background = 'Yellow';
        }



    </script> 
</head>
<body onload="getName()">
        <form class="basic_form">
            <h1 id="txtWelcome"></h1>

    <p>Please input your login details</p>
            <fieldset>
                <label class="form_labels">Username:</label>
                <input class="form_fields" type="text"  name="username"><br>
                <label class="form_labels">E-Mail:</label>
                <input class="form_fields" type="email" name="email"><br>
                <label class="form_labels">Password:</label>
                <input class="form_fields" type="password" name="password">
                <input class="form_buttons" type="Submit" value="Submit"><br>
            </fieldset>
        </form>
</body>

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-03-09 22:00:52

以下是javascript解决方案:

代码语言:javascript
运行
复制
var submitButton = document.getElementById('submit');

submitButton.addEventListener('mouseover', function() {
    this.style.backgroundColor='blue';
});

submitButton.addEventListener('mouseout', function() {
    this.style.backgroundColor='yellow';
});

https://jsfiddle.net/hsxdkkp6/

但是为什么不直接使用css呢?

代码语言:javascript
运行
复制
input[type=submit]:hover {
  background-color: red;
}

https://jsfiddle.net/jkkj8dvt/

票数 3
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/35903472

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档