:cry: :cry: 小弟比较菜,最近在学习javascript。但是遇到了一些问题不知道如何解答,求大神们看看!!!!在html中输入输入姓名,email,电话等这样基本的信息,然后点提交后会在下面显示出刚才的输入结果,然后后面有按钮可以选择删除掉这条信息。有一个查找按钮,文本框里输入要查找的信息,如果找到直接显示出来,如果没有alert提示查找失败。这些在一个页面上实现就行。谢谢了!!!!! :cry: :cry: :cry:
[code="jsp"]
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
javascript的增删改查
<br> /**<br> * 删除字符串左右两端的空格<br> <em>/<br> String.prototype.trim= function()<br> {<br> return this.replace(/(^\s</em>)|(\s*$)/g, "");<br><br> }</p> <pre><code> /** * 提交信息 */ function submitValue(){ var trId=Math.random(); //产生一个随机数作为这一行的id var table = document.getElementById("displayText"); var name = document.getElementById("name").value.trim(); var sex = document.getElementById("sex").value.trim(); var age = document.getElementById("age").value.trim(); var telephone = document.getElementById("telephone").value.trim(); row = table.insertRow(); //增加行 for(i=0;i<5;i++){ cell = row.insertCell(); } row.id=trId; //将随机数赋给行id row.cells[0].innerHTML = name.length>0?name:"&nbsp;" ; row.cells[1].innerHTML = sex.length>0?sex:"&nbsp;"; row.cells[2].innerHTML = age.length>0?age:"&nbsp;"; row.cells[3].innerHTML = telephone.length>0?telephone:"&nbsp;"; row.cells[4].innerHTML = "<button onclick='delText(\""+trId+"\");'>删除</button>"; reset(); //重置输入框(自定义寒暑) } /** * 重置name等输入框信息 */ function reset(){ document.getElementById("name").value=""; document.getElementById("sex").value=""; document.getElementById("age").value=""; document.getElementById("telephone").value=""; } /** * 删除信息 根据行id删除行 */ function delText(trId){ var table = document.getElementById("displayText"); for(i=0;i<table.rows.length;i++){ if(table.rows[i].id==trId){ table.deleteRow(i); } } } /** * 查询信息 */ function checkValue(){ var table = document.getElementById("displayText"); var check = document.getElementById("check").value.trim(); //将每行第一列数据和查询信息比较,不同的将这一行隐藏 for(i=1;i<table.rows.length;i++){ if(check.length==0){ //如果没有输入查询信息,显示所有行 table.rows[i].style.display="block"; }else if(table.rows[i].cells[0].innerText!=check){ table.rows[i].style.display="none"; }else{ table.rows[i].style.display="block"; } } } </script> </code></pre> <p></head><br> <body><br> <h3>javascript</h3> <br><br> 姓名:<input type="text" id="name"><br> 性别:<input type="text" id="sex"><br> 年龄:<input type="text" id="age"><br> 电话:<input type="text" id="telephone"><br> <button onclick="submitValue()">提交</button><hr /><br> 查询姓名:<input type="text" id="check"> <button onclick="checkValue()">查询</button><br /><br /> <br> <table id="displayText" border="2" cellspacing="0" cellpadding="0"><br> <tr><br> <td width="150" height="20">姓名</td><br> <td width="150" height="20">性别</td><br> <td width="150" height="20">年龄</td><br> <td width="150" height="20">电话</td><br> <td width="150" height="20">操作</td><br> </tr><br> </table><br> </body><br> </html><br> [/code]<br> 将第一行第二行删掉,可以保存成html,这个是纯js写出来的,如果要用ajax的话,得涉及后台,servlet之类的</p>
可以用ajax来处理