本页无刷新修改后台数据

最新推荐文章于 2022-08-01 15:36:22 发布

ASdeAK1983

最新推荐文章于 2022-08-01 15:36:22 发布

阅读量1.1k

点赞数

CC 4.0 BY-SA版权

分类专栏： ajax 文章标签： button input stylesheet table function border

本文链接：https://blog.youkuaiyun.com/ASdeAK/article/details/1946354

ajax 专栏收录该内容

7 篇文章

订阅专栏

由于后台各不同,所以就没有连接后台了,只是做了个简单的数据返回

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>MyHtml.html</title>

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

</head>

<body>
<form name="form1" action="*">
    <table id="modifynametable" name="modifynametable" border="1" cellpadding="1" cellspacing="1" width="50%"/>
    <tr>
       <td width="70%">

</td>
       <td>
         <input type="button" name="modify" value="修改" onclick="initModify();"/>
       </td>
<td>
</td>
    </tr>
    </table>
    <table name="modifyname" id="modifyname" border="1" cellpadding="1" cellspacing="1" width="50%"/>
    <tr>
<td width="20%">
          用户名称:
       </td>
       <td>
          星哥
       </td>

    </tr>
    </table>
    </form>
</body>
<script language="javascript">
   function initModify()
   {
    //modifynametable
      var tableobj1= document.getElementById("modifynametable");

var savebtn = tableobj1.rows[0].children.item(1);

      savebtn.innerHTML="<input type='button' name='save' value='保存' onclick='saveModify();'/>";

      var backbtn=tableobj1.rows[0].children.item(2);

      backbtn.innerHTML="<input type='button' name='cancel' value='返回' onclick='cancelModify();'/>";
    //modifyname
      //用户text
      var table= document.getElementById("modifyname");

      var name = table.rows[0].children.item(1);
      name.value=name.innerHTML;
      name.innerHTML="";
      var nameobj = document.createElement("input");
      nameobj.type="text";
      nameobj.maxLength=30;
      nameobj.id="name";
      nameobj.name="name";
      nameobj.value=name.value;
      nameobj.size="30";
      name.appendChild(nameobj);
      name.align="left";

   }
    function saveModify()
    {
//modifynametable
      var tableobj1= document.getElementById("modifynametable");

var savebtn = tableobj1.rows[0].children.item(1);

      savebtn.innerHTML="<input type='button' name='save' value='修改' onclick='initModify();'/>";

      var backbtn=tableobj1.rows[0].children.item(2);

backbtn.innerHTML="";

//modifyname

var table= document.getElementById("modifyname");

      var name = table.rows[0].children.item(1);
      name.innerHTML=document.all.name.value;


    }
    function cancelModify()
    {
//modifynametable
      var tableobj1= document.getElementById("modifynametable");

var savebtn = tableobj1.rows[0].children.item(1);

      savebtn.innerHTML="<input type='button' name='save' value='修改' onclick='initModify();'/>";

      var backbtn=tableobj1.rows[0].children.item(2);

backbtn.innerHTML="";

//modifyname

var table= document.getElementById("modifyname");

var name = table.rows[0].children.item(1);
name.innerHTML=name.value;

}
</script>
</html>