<!DOCTYPE html>
<html>
<head>
<title>搜索</title>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
</head>
<body>
<form action="" method="get" id="J_search_artical" enctype='application/json'>
<input type="search" id="J_search_content" placeholder="搜索" />
</form>
</body>
<script>
window.onload = function(){
document.getElementById("J_search_artical").onsubmit = function () {
var title = document.getElementById("J_search_content").value;
alert('title:'+ title);
document.getElementById("J_search_content").blur()
// do search
return false;
};
}
</script>
</html>1 使用form表單
2 form表單action填空，使用js發送請求
3 form上增加enctype='applicaion/json'
4 點擊搜索按鈕的時候，會觸發onsubmit事件
5 添加return false，屏蔽form表單會自動觸發提交刷新頁面的事件