表单数据收集 展示

提交

 $(".btn").click(function () {
    var htmlGroup = $('[data-type]:visible');
    var postData = getData(htmlGroup);
    console.log(postData);
    
})

收集

 //方法函数 取值
  function getData(htmlAddr) {
      var _cash = {};
      htmlAddr.each(function (key, value) {
          $this = $(this);
          var key = $this.attr('data-type');
          var DomType = this.nodeName.toLowerCase();
          switch (DomType) {
              case 'div':
                  if ($this.text())
                      _cash[key] = $this.text();
                  break;
              case 'img':
                  _cash[key] = $this.attr('src');
                  break;
              case 'input':
                  if ($this.attr('data-type') != "code") {
                      if (!foremTest("Nothing", $this.val(), '不能有值为空！')) {
                          return false;
                      }
                  }
                  _cash[key] = $this.val();
                  break;
              default:
                  console.log('err');
          }
      });
      return _cash;
  }

验证

  function foremTest(type, value, alert) {
      var reg = {
          Phone: /^(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/,
          Nothing: /\S/
      };
      if (!reg[type].test(value)) {
          $.alert(alert);
          return false;
      }
      return true;
  }

方法函数 赋值

    function setData(htmlAddr,ajaxData) {//htmlAddr 页面元素集合 ajaxData后台返回的数据
        var _cash = {};
        $.each(ajaxData, function (index1,value1) {
            htmlAddr.each(function (key, value) {
                $this = $(this);
                var key = $this.attr('data-type');
                if (index1 == key) {
                    var DomType = this.nodeName.toLowerCase();
                    switch (DomType) {
                        case 'div':
                                 $this.text(value1);
                            break;
                         case 'span':
                                 $this.text(value1);
                            break;
                        case 'img':
                                 $this.attr('src',value1);
                            break;
                        case 'input': $this.val(value1);
                            break;
                        default:
                            console.log('err');
                    }
                }
                
            });
        })           
    }