HTML+jQuery实现动态添加输入框

一个html文件和一个js文件配合，在html文件里引入js文件，用jQuery为<a>标签添加一个点击事件，事件里只需写一个append函数就可以。

HTML源码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-2.2.2.min.js"></script>
    <script src="add.js"></script>
</head>
<body>
    <form method="post" action="">
        专题列表：<a href="#" id="AddMoreTextBox" >添加输入框</a>
                  <br/>
        <div id="InputsWrapper">
                  <input type="text" name="news[]" id="news_1" value="Text 1"><br/><br/>
                  <input type="text" name="news[]" id="news_2" value="Text 2"><br/><br/>
                  <input type="text" name="news[]" id="news_3" value="Text 3"><br/><br/>
            </div>
                  <input type="submit" name="edit" value="提交">
        </form>
</body>
</html>

jQuery源码：

$(document).ready(function () {
    var InputCount=3;
    $("#AddMoreTextBox").click(function (e)
    {
            InputCount++;
            $("#InputsWrapper").append('<label></label><input type="text" name="news[]" id="news_' + InputCount + '" value="Text '+ InputCount +'"/><br/><br/>');
    });
});