一、前言
在做项目中,将有些容易忘记的代码进行汇总。
二、案例
表单提交,如一个页面的搜索。
表单的代码
<form class="search-form" id="search"> <div class="mui-input-row mui-search" > <input type="search" class='searchKey' name="key" id="key" placeholder="请输入关键字搜索" /> <!--<button type="submit">搜索</button>--> </div> </form>
//监听输入框的内容 document.getElementById("key").addEventListener('input', function () { console.log(this.value); }); //onsubmit 方法 document.getElementById("search").onsubmit = function () { console.log(this); var result = this.querySelector(".searchKey").value; //使用了querySelector 获取子元素 console.log(result); return false; }
结果截图:在 GoogleChrome 的Console输出截图
结束,就是这样的。