JavaWeb--JQuery中的$(function()) 

<%--
  Created by IntelliJ IDEA.
  User: Skye
  Date: 2017/12/21
  Time: 21:05
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script type="text/javascript" src="${pageContext.request.contextPath}/scripts/jquery-1.7.2.js"></script>
    <script type="text/javascript">
       $(function(){

            var i = 2;

            $("#addFile").click(function(){
                $(this).parent().parent().before("<tr class='file'><td>File"
                    + i +"</td><td><input type='file' name='file"
                    + i + "'></td></tr>"
                    + "<tr class='desc'><td>Desc"
                    + i + "</td><td><input type='text' name='desc"
                    + i + "'><button id='delete"
                    + i + "'>删除</button></td></tr>");
                i++;

                //获取新添加的删除按钮
                $("#delete" + (i - 1)).click(function(){
                    var $tr = $(this).parent().parent();
                    $tr.prev("tr").remove();
                    $tr.remove();

                    //对i进行重排序
                    $(".file").each(function(index){
                        var n = index + 1;
                        $(this).find("td:first").text("File" + n);
                        $(this).find("td:last input").attr("name", "file" + n);
                    });

                    $(".desc").each(function(index){
                        var n = index + 1;
                        $(this).find("td:first").text("Desc" + n);
                        $(this).find("td:last input").attr("name", "desc" + n);
                    });
                });
                return false;
            });
        });
    </script>
</head>
<body>

<font color="red">${message}</font>
<br><br>
<form action="/UploadServlet" method="post" enctype="multipart/form-data">
    <input type="hidden" id="fileNum" name="fileNum" value="1">

    <table>
        <tr class="file">
            <td>File1</td>
            <td><input type="file" name="file1"></td>
        </tr>
        <tr class="desc">
            <td>Desc1</td>
            <td><input type="text" name="desc1"></td>
        </tr>
        <tr>
            <td><input type="submit" id="submit" value="提交"></td>
            <td><button id="addFile">新增一个附件</button></td>
        </tr>
    </table>
</form>
</body>
</html>

　　

 

posted @ 2017-12-22 10:52  SkyeAngel  阅读(363)  评论(0)    收藏  举报