来自 前端技术 2019-09-04 19:43 的文章
当前位置: 六合联盟网 > 前端技术 > 正文

动态增加删除行,js动态创建标签示例代码

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

复制代码 代码如下:

<%

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"

String path = request.getContextPath();

  • request.getServerName() + ":" + request.getServerPort()
  • path + "/";
    %>

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

%>

<title>My JSP 'createElement.jsp' starting page</title>

 

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<script type="text/javascript"
src="<%=request.getContextPath()%>/jquery/jquery-1.7.min.js"></script>
<script type="text/javascript">
六盒宝典免费资料大全,$(function() {
$("#but").click(function() {
var para = document.createElement("p");
var node = document.createTextNode("这是新段落。");
para.appendChild(node);

<手机看开码,!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

var element = document.getElementById("div1");
六合联盟网,element.appendChild(para);

<html>

})
})
</script>
</head>
<body>
<div id="div1">
<p id="p1">
这是一个段落。
</p>
<p id="p2">
这是另一个段落。
</p>
</div>
<input type="button" id="but" value="添加">
</body>
</html>

  <head>

代码如下: %@ page language="java" import="java.util.*" pageEncoding="UTF-8"% % String path = request.getContextPath(); String basePath = request.getScheme() + "://...

    <base href="<%=basePath%>">

    

    <title>My JSP 'test.jsp' starting page</title>

    

    <meta http-equiv="pragma" content="no-cache">

    <meta http-equiv="cache-control" content="no-cache">

    <meta http-equiv="expires" content="0">    

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

    <meta http-equiv="description" content="This is my page">

    <!--

    <link rel="stylesheet" type="text/css" href="styles.css">

    -->

 

  </head>

  

 <body>

    <form action="<%=path %>/news.do?method=add" method="post" enctype="multipart/form-data">

    <input type="hidden" name="id" value="${news.id }">

        <table width="90%" border="0" align="left" cellpadding="0" cellspacing="1" class="newTable">

             <tr>

                 <td colspan="2" id="more">                 

                 楼层名称<input type="text" name="name" size="30" value="111">楼层简介<input type="text" name="info" size="30" value="111"><input type="button" onclick="addFile();" value="增加">

                </td>

            </tr>

        </table>

    </form>

    <script type="text/javascript">

        var t = 1;

        function addFile()

        {

            var parent = document.getElementById("more");

            var br = document.createElement("br");

            var charName= document.createTextNode("楼层名称")

            var inputName = document.createElement("input");

            var charInfo= document.createTextNode("楼层简介")

            var inputInfo = document.createElement("input");

            var button = document.createElement("input");

            

            inputName.value="111";

            inputName.type = "text";

            inputName.name = "name[" + (t++) + "]";

            inputName.size = "30";

            

            inputInfo.value="111";

            inputInfo.type = "text";

            inputInfo.name = "info[" + (t++) + "]";

            inputInfo.size = "30";

            

            button.type = "button";

            button.value = "删除";    

            button.onclick = function()

            {

                parent.removeChild(br); 

                parent.removeChild(charName); 

                parent.removeChild(inputName);

                parent.removeChild(charInfo);

                parent.removeChild(inputInfo);

                parent.removeChild(button);

            };  

            parent.appendChild(br); 

            parent.appendChild(charName);  

            parent.appendChild(inputName);

            parent.appendChild(charInfo);

            parent.appendChild(inputInfo);

            parent.appendChild(button);

        }

    </script>

</body>

</html>

 

page language=java import=java.util.* pageEncoding=UTF-8% % String path = request.getContextPath(); String basePath = request.getScheme()+://+request.getServerName()+:+request.ge...

本文由六合联盟网发布于前端技术,转载请注明出处:动态增加删除行,js动态创建标签示例代码

关键词: