<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>H5表格提交</title> <script src="appWeb.js"></script></head><body> <table> <tr><td>姓名:</td><td><input type="text" id="name"></td></tr> <tr><td>email:</td><td><input type="text" id="email"></td></tr> <tr><td>电话号码:</td><td><input type="text" id="tel"></td></tr> <tr><td>备注:</td><td><input type="text" id="memo"></td></tr> <tr> <td></td> <td><input type="button" value="保存" onclick="saveStorage()"></td> </tr> </table> <hr/><p>检索: <input type="text" id="find"> <input type="button" value="检索" onclick="findStorage('msg')"></p><p id="msg"></p></body></html>
function saveStorage(){ var data = new Object(); data.name = document.getElementById("name").value; data.email = document.getElementById("email").value; data.tel = document.getElementById("tel").value; data.memo = document.getElementById("memo").value; var str = JSON.stringify(data); localStorage.setItem(data.name,str); alert("data saved");} function findStorage(id){ var find = document.getElementById("find").value; var str = localStorage.getItem(find); var data = JSON.parse(str); var result = "name:"+data.name+"<br/>"; result += "email:"+data.email+"<br/>"; result += "tel:"+data.tel+"<br/>"; result += "memo:"+data.memo+"<br/>"; var target = document.getElementById(id); target.innerHTML = result;}
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>H5表格提交</title> <script src="appWeb.js"></script></head><body> <table> <tr><td>姓名:</td><td><input type="text" id="name"></td></tr> <tr><td>email:</td><td><input type="text" id="email"></td></tr> <tr><td>电话号码:</td><td><input type="text" id="tel"></td></tr> <tr><td>备注:</td><td><input type="text" id="memo"></td></tr> <tr> <td></td> <td><input type="button" value="保存" onclick="saveStorage()"></td> </tr> </table> <hr/><p>检索: <input type="text" id="find"> <input type="button" value="检索" onclick="findStorage('msg')"></p><p id="msg"></p></body></html>
function saveStorage(){ var data = new Object(); data.name = document.getElementById("name").value; data.email = document.getElementById("email").value; data.tel = document.getElementById("tel").value; data.memo = document.getElementById("memo").value; var str = JSON.stringify(data); localStorage.setItem(data.name,str); alert("data saved");} function findStorage(id){ var find = document.getElementById("find").value; var str = localStorage.getItem(find); var data = JSON.parse(str); var result = "name:"+data.name+"<br/>"; result += "email:"+data.email+"<br/>"; result += "tel:"+data.tel+"<br/>"; result += "memo:"+data.memo+"<br/>"; var target = document.getElementById(id); target.innerHTML = result;}
以上就是html5学习之旅-html5的简易数据库开发(18)的内容,更多相关内容请关注PHP中文网(www.php.cn)!