博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
在升级版数据的收集和赋值。只针对上篇文章。
阅读量:6583 次
发布时间:2019-06-24

本文共 6069 字,大约阅读时间需要 20 分钟。

上篇文章的缺点在于需要传参数,而且参数的个数被限制,当页面的布局不符合参数是,上篇文章的js封装即为失败品。

下面是稍微升级版的1.1版本。通过自定义的属性来收集 参数,就破除了参数的设定,在页面布局的时候只需要录入一个固定的自定义属性即可。

我自己在项目中固定的属性为:表格外面需要获取的数据自定义属性为--savename,表格属性为--saveitem,表格内需要收集的自定义属性为--saveitemname

如果我有幸帮到您,您可自行更改

代码如下:

产品ID 产品编号 产品名称 产品参数 操作
var jsons = function () { };jsons.prototype = {    get: function () {        return GetData();    },    set: function (json) {        FillData(json);    }}function GetData() {    //所有的表格外的输入框,下拉框,单选,多选,富文本,必须强调属性savename    var content = $('*[savename]');    var root = CollectionInputData(content);    //所有的表格内的数据必须给表格声明属性 saveitem    var tablejson = [];    var tablecontent = $('*[saveitem]');    for (var j = 0; j < tablecontent.length; j++) {        try {            var tabledata = new Array();            var tables = tablecontent.eq(j).find("tr");            for (var i = 0; i < tables.length; i++) {                var trDatas = new Object();                var tdData = tables.eq(i).find('*[saveitemname]');                if (tdData.length < 1) continue;                trDatas = CollectionInputData(tdData);                tabledata.push(trDatas);            }            tablejson[tablecontent.eq(j).attr("name")] = tabledata;        } catch (e) {            alert("抱歉,攻城狮正在攻城!");        }    }    return $.extend(root, tablejson);}//收集指定容器内输入框的数据function CollectionInputData(content) {    var root = new Object();    try {        for (var j = 0; j < content.length; j++) {            var myobject = new Object();            switch (content[j].type) {            case "text":            case "hidden":            case "textarea":            case "number":                if (content[j].value != "" && content[j].value != undefined) {                    if (root[content[j].name]) {                        myobject[content[j].name] = content[j].value;                    } else {                        root[content[j].name] = content[j].value;                    }                }                break;            case "radio":            case "checkbox":                root[content[j].name] = content[j].checked ? 1 : 0;                break;            case "select-one":                if (content[j].value != "" && content[j].value != undefined) {                    root[content[j].name] = content[j].value;                } else {                    root[content[j].name] = -1;                }                break;            default:                break;            }        }        return root;    } catch (error) {        alert("抱歉,攻城狮正在攻城!");    }    return root;}function FillData(json) {    var content = $("*[savename]");    Fill(content, json);    var tablecontent = $("*[saveitem]");    for (var i = 0; i < tablecontent.length; i++) {        var tables = tablecontent.eq(i);        FillTableData(tables, json);    }}// 指定位置容器赋值function Fill(content, json) {    for (var i = 0; i < content.length; i++) {        if (json[content[i].name]) {            switch (content[i].type) {            case "text":            case "hidden":            case "textarea":            case "number":                content[i].value = json[content[i].name];                break;            case "radio":            case "checkbox":                content[i].checked = json[content[i].name];            case "select-one":                content[i].value = json[content[i].name];                break;            default:            }            //移除json中已经使用过的值            // delete json[content[i].name];        }    }}//填充表格数据function FillTableData(content, json) {    var tables = content.find("tr");    var tdData;    switch (tables.length) {    case 0:        return;    default:        tdData = tables.eq(0).find("*[saveitemname]");        var i;        if (tdData.length > 0) {            for (i = 0; i < json[content.attr("name")].length - tables.length; i++) {                trAdd(content);            }            //重新获取有几个tr            tables = content.find("tr");            for (i = 0; i < json[content.attr("name")].length; i++) {                //循环赋值                tdData = tables.eq(i).find("*[saveitemname]");                Fill(tdData, json[content.attr("name")][i]);            }        } else {            if (json[content.attr("name")] != "" && json[content.attr("name")] != undefined) {                for (i = 0; i < json[content.attr("name")].length - (tables.length - 1) ; i++) {                    trAdd(content);                }                //重新获取有几个tr                tables = content.find("tr");                for (i = 0; i < json[content.attr("name")].length; i++) {                    //循环赋值                    tdData = tables.eq(i + 1).find("*[saveitemname]");                    Fill(tdData, json[content.attr("name")][i]);                }            }        }        break;    }}//增加表格行function trAdd(content) {    var str = "";    if (content.find('tr').length > 1) {        str += content.find('tr').eq(1)[0].innerHTML;    } else {        str += content.find('tr').eq(0)[0].innerHTML;    }    str += "";    content.append(str);}//删除指定行function trDelete(content) {    var td = $(content);    td.parents("tr").remove();}
View Code

还请不吝指教。

转载于:https://www.cnblogs.com/CnnBlog/p/9366207.html

你可能感兴趣的文章
深度解析Istio系列之安全模块篇
查看>>
Linux 系统 审计
查看>>
性能测试 vbs使用(一)
查看>>
jQuery基础
查看>>
BZOJ5312:冒险——题解
查看>>
echarts,两点连线,中间断裂
查看>>
samba简易配置
查看>>
庆祝在CNBlogs开博!
查看>>
javascript reverse string
查看>>
南阳oj 题目6 喷水装置(一)
查看>>
运筹学上机实验 - 单纯形方法的两阶段法
查看>>
文件状态是否变化
查看>>
MongoDB的副本集Replica Set
查看>>
Maven项目中的配置文件找不到以及打包问题
查看>>
面向对象
查看>>
HDU 1058 Humble Numbers
查看>>
NYOJ The Triangle
查看>>
wps10.1中将txt转为excel
查看>>
解决执行脚本报syntax error: unexpected end of file或syntax error near unexpected token `fi'错误的问题...
查看>>
[BZOJ3312][USACO]不找零(状压DP)
查看>>