EVENT事件-------表单事件

思维导图

公共样式

<form action="http://www.csdn.net">
        <label for="">姓名</label>
        <input id="name" type="text" name="name">
    </form>
    <button>点我</button>

 var iptName = document.getElementById('name');

focus

focus元素获得焦点时触发

 // 获取焦点
    iptName.onfocus = function() {
        console.log("我被点了");
    }

blur

blur元素失去焦点时触发

 // 失去焦点
    iptName.onblur = function() {
        console.log("我好想出去呀！");
    }

submit()

submit() 提交表单

// submit()
    var form = document.querySelector("form");
    var btn = document.querySelector("button");
    btn.onclick = function() {
        form.submit();  // 相当于 <input type='submit' />
    }

change和input的区别

change：value发生改变，并失去焦点时触发
input: 只要value发生变化就触发

 // change &&&& input
    iptName.onchange = function() {
        console.log('change');
    }
    iptName.oninput = function() {
        console.log('input');
    }