美文网首页
表单事件

表单事件

作者: 洛洛kkkkkk | 来源:发表于2017-04-20 19:20 被阅读0次
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
            <style type="text/css">
                
            </style>
        </head>
        <body>
            <form action="http://www.baidu.com" method="">
                <input type="text" id="uname" value="请输入账号"/>
                <input type="submit" value="提交按钮" />
                <input type="reset" value="重置" />
            </form>
        </body>
        <script type="text/javascript">
            var form =document.querySelector('form');
            var unameInput = document.querySelector("#uname");
            //输入框的焦点事件
            unameInput.onfocus = function () {
                console.log("点击了输入框");
                this.value="";
            }
            //表单被重置的时候执行的事件
            form.onreset = function () {
                console.log("被重置了吧");
            }
            
            form.onsubmit = function (ev) {
                //获取表单事件对象
                var e=ev|| event;
                alert("点击了提交按钮");
                //默认事件
                //浏览器里面右键默认事件-展示菜单
                
                //阻止默认 事件。
    //          return false;
                //阻止默认事件的另一种方式 不兼容IE6-8
                e.preventDefault();
            }
            window.onresize = function () {
                console.log("ssda");
            }
        </script>
    </html>
    

    相关文章

      网友评论

          本文标题:表单事件

          本文链接:https://www.haomeiwen.com/subject/fmolzttx.html