jQuery中数组的使用

数组的定义

// 月计划id
var mpIds = [];
// 日计划Contentid
var dailyContentIds=[];

push()方法

添加元素

<c:forEach items="${m.normalDailyPlanContent}" var="ndp" varStatus="status">
    mpIds.push("${ndp.monthPlanId}");
    dailyContentIds.push('${ndp.id}');
</c:forEach>

splice()方法

删除元素

function removeNormalDailyPlan(a) {
    $.app.confirm({
        message: "确认删除吗？",
        ok: function () {
            for (var i = 0; i < mpIds.length; i++) {
                for(var i=0;i<dailyContentIds.length;i++){
                    if($(a).closest('tr').children('td').eq(1).find('input').val()){
                        dailyContentIds.splice(i,1);
                    }
                }
                if (mpIds[i] == $(a).closest('tr').children('td').first().find("input").val()) {
                    $(a).closest('tr').remove();
                    reCalcuSurplusBusinessVolume();
                    mpIds.splice(i, 1);
                    return;
                }
            }
        }
    });
}

Java数组对比

Java数组
定义好之后空间就是固定的，无法添加，删除元素，只能替换某个元素

JS数组
可以添加，删除元素，更加的灵活

示例代码

function autoCheckboxTree() {
    // 获取JSON
    var jsonString = '${assayItemClassExtList}';
    var jsonObject = $.parseJSON(jsonString);
    // 数据源
    var sourceList = [];
    // 解析JSON
    var tree = $("<div class='tree'></div>");
    for (var i = 0; i < jsonObject.length; i++) {
        var json = jsonObject[i];
        var tier = json.tier;
        if (tier == '1') {
            var treeModel = "<div class='treeModel'></div>"
            var treeOne = "<div class='treeDivStyle treeOneStyle'>" +
                "<div class='childrenOneDivStyle'><input class='checkboxTreeStyle' type='checkbox'><a class='treeTextStyle'></a></div></div>";
            tree.append(treeModel);
            tree.children("div[class='treeModel']").last().append(treeOne);
            var control = tree.children("div[class='treeModel']").last().children("div[class='treeDivStyle treeOneStyle']").last().children("div[class='childrenOneDivStyle']");
            control.find('a').html(json.name);
            control.find('a').attr('title', json.name);
            control.find('a').val(json.id);
        }
        if (tier == '2') {
            var treeChildrenModel = "<div class='treeChildrenModel'>";
            var treeTwo = "<div class='treeDivStyle treeTwoStyle'>" +
                "<div class='childrenOneDivStyle'><input class='checkboxTreeStyle' type='checkbox'><a class='treeTextStyle'></a></div></div>";
            tree.children("div[class='treeModel']").last().append(treeChildrenModel);
            tree.children("div[class='treeModel']").last().children("div[class='treeChildrenModel']").last().append(treeTwo);
            var control = tree.children("div[class='treeModel']").last().children("div[class='treeChildrenModel']").last().children("div[class='treeDivStyle treeTwoStyle']").last().children("div[class='childrenOneDivStyle']");
            control.find('a').html(json.name);
            control.find('a').attr('title', json.name);
            control.find('a').val(json.id);
        }
        if (tier == '3') {
            var treeThree = "<div class='treeDivStyle treeThreeStyle'><div class='childrenOneDivStyle'><input class='checkboxTreeStyle' type='checkbox'><a class='treeTextStyle'></a></div></div>";
            tree.children("div[class='treeModel']").last().children("div[class='treeChildrenModel']").last().append(treeThree);
            var control = tree.children("div[class='treeModel']").last().children("div[class='treeChildrenModel']").last().children("div[class='treeDivStyle treeThreeStyle']").last().children("div[class='childrenOneDivStyle']");
            control.find('a').html(json.name);
            control.find('a').attr('title', json.name);
            control.find('a').val(json.id);
            sourceList.push(json.name);
        }
    }
    var autoInput = "<input class='autoInputStyle' placeholder='模糊搜索'></input>";
    var controlTree = "<div class='treeControlStyle'><div class='childrenOneDivStyle'>" +
        "<button class='buttonTreeStyle confirmTree'>确认</button>" +
        "<button class='buttonTreeStyle closelTree'>关闭</button></div></div>";
    $('.treeSelect').append(autoInput).append(tree).append(controlTree);
    // 监听
    $('.treeSelect').children("input[class='autoInputStyle']").bind('input propertychange', function () {
        var value = $('.treeSelect').children("input[class='autoInputStyle']").val();
        if (value == '') {
            $('.tree').children("div[class='treeModel']").children("div[class='treeChildrenModel']").children('div').css('display', 'none');
        } else {
            var autoList = [];
            for (var i = 0; i < sourceList.length; i++) {
                var name = sourceList[i];
                var int = name.indexOf(value);
                if (int >= 0) {
                    autoList.push(name);
                }
            }
            $('.tree').children("div[class='treeModel']").children("div[class='treeChildrenModel']").children('div').css('display', 'none');
            $('.tree').find("div[class='treeDivStyle treeThreeStyle']").find('div').find('a').each(function () {
                var name = $(this).text();
                for (var i = 0; i < autoList.length; i++) {
                    var itemName = autoList[i];
                    if (name == itemName) {
                        $(this).parent().parent().css('display', '');
                        $(this).parent().parent().parent().children("div[class='treeDivStyle treeTwoStyle']").css('display', '');
                    }
                }
            })
        }
    });
}