layui动态生成输入框，限制个数，并取到其中值

layui框架，效果：
代码比较简陋，待优化
代码实现

html:

      <div class="layui-card-body">
        <form class="layui-form">

          <div class="layui-form-item" style="display: none;">
            <div class="layui-inline">
              <label class="layui-form-label">一级分类ID：</label>
              <div class="layui-input-inline">
                <input type="tel" name="categoryId" id="categoryId" lay-verify="required" class="layui-input" style="width: 200%;">
              </div>
            </div>
          </div>

          <div class="layui-form-item" >
            <div class="layui-inline">
              <label class="layui-form-label">一级分类：</label>
              <div class="layui-input-inline">
                <input type="tel" name="categoryName" id="categoryName" lay-verify="required|name" class="layui-input" style="width: 200%;">
              </div>
            </div>
          </div>

          <div class="layui-form-item">
            <div class="layui-inline">
              <label class="layui-form-label">二级分类：</label>
              <!-- 动态生成二级分类-->
              <div id="appendSecond" name=""> </div>
            </div>
          </div>


          <div class="layui-form-item">
            <div class="layui-inline">
              <label class="layui-form-label"></label>
              <div class="layui-inline">
                <input type='button' class="layui-btn layui-btn-sm layui-btn-primary" id="add" value="+ 添加二级分类"/>
              </div>
              <div class="layui-inline"><span>备注：每个一级分类下至多可以存在8个二级分类，且标题由4-5个汉字组成</span></div>
            </div>
          </div>


          <div class="layui-form-item">
            <div class="layui-input-block">
              <button class="layui-btn" lay-submit="" lay-filter="edit" id="edit" type="button">发布</button>
            </div>
          </div>

        </form>

    </div>

js:

;layui.define(['jquery', 'table', 'form', 'layer', 'laydate'], function (exports) {
  "use strict";
  var $ = layui.$, table = layui.table, layer = layui.layer, laydate = layui.laydate,
    form = layui.form, admin = layui.admin, router = layui.router();

  //二级菜单栏数量
  var listSize = '';

  /**
   * 根据id获取当前面页面
   * @param id
   */
  function page(id) {
    admin.req({
      url: '127.0.0.1:8080/get?id=' + id,
      type: "GET",
      contentType: "application/json;charset=utf-8",
      success: function (obj) {
        var data = obj.data;
        if (obj.code === 200) {
          $("#categoryId").val(data.categoryId);
          $("#categoryName").val(data.categoryName);
          generateSecond(data.secondCategoryList);
          listSize = data.secondCategoryList.length;
        }
      },
      error: function () {
      }
    });
  }

 /**
   * 旧二级菜单栏
   * 显示二级菜单栏
   * @param list 当前二级菜单
   */
  function generateSecond(list) {
    if (list === null || list.length <= 0) {
      return;
    } else {
      for (var x in list) {
        var html = " <div class=\"layui-input-block\" style=\"margin-bottom: 15px;\">\n" +
          "                <input type=\"input\" name=\"oldSecondCategory\" id=\"" + list[x].categoryId + "\" + value=\"" + list[x].categoryName + "\" lay-verify=\"required|name\" class=\"layui-input\" style=\"width: 200%;\">\n" +
          "              </div>";
        $("#appendSecond").append(html);
      }
    }
  }
  
 /**
   * 新生成的二级菜单
   * 点击生成菜单输入框
   */
  var spotMax = listSize;
  $("#add").click(function () {
    if (spotMax > 7 - listSize) {
      layer.alert("最多只能添加8个二级菜单");
    } else {
      var html = " <div class=\"layui-input-block\" id=\"secondCategory\" style=\"margin-bottom: 15px;\">\n" +
        "                <input type=\"input\" id=\"generate" + spotMax + "\" name=\"newSecondCategory\" lay-verify=\"required|name\" class=\"layui-input\" style=\"width: 200%;\">\n" +
        "              </div>";
      $("#appendSecond").append(html);
      spotMax++;
    }
  });

  form.on('submit(edit)', function (data) {
  //拿到输入框的值，通过表单的name拿到值
    var newSecondCategory = [];
    $("input[name='newSecondCategory']").each(function () {
      newSecondCategory.push($(this).val());
    });
    var oldSecondCategory = [];
    $("input[name='oldSecondCategory']").each(function () {
      oldSecondCategory.push($(this).val());
    });
    //ajax请求修改
 
    return false;//防止页面跳转
  });

});

//如果要校验表单元素

因为form表单有加：lay-verify="required|name"，所以，js代码如下
//只能输入中文
 function check(value) {
    var reg = /^[\u4e00-\u9fa5]+$/;
    if (!reg.test(value)) {
      return false;
    }
    return true;
  }
  
 //自定义验证规则
  form.verify({
     name:function (value) {
       if(value.length > 5){
         return "标题由4-5个汉字组成！";
       }else if(value.length < 4){
         return "标题由4-5个汉字组成！";
       }else{
         if(!check(value)){
           return "标题由4-5个汉字组成！";
         }
       }
     }
  });