jquery使用笔记

前言碎语

为什么要发这篇博文呢 ，因为博主前端太low了，写个异步增删改，搜了一大堆资料，虽然博主一心只搞大后端服务器开发，方向不是在前端，但是工作中不能避免的偶尔还是要接触一下的，所以记录下来一些通用的技巧，以备不时之需，同时也给有需要的人做一个参考

var appno = '';
$(document).ready(function () {
    this.appno =appno= getUrlParam('appno');
    $("#appno").val(appno);
    $("#editBtn").hide();//隐藏编辑按钮
    init(appno);
});
//获取url中的参数
function getUrlParam(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
    var r = window.location.search.substr(1).match(reg);
    if (r != null) return unescape(r[2]);
    return null;
}
//初始化数据
function init(appno) {
    $.ajax({
        url: '/service/carManage/lists/' + appno,
        success: function (data) {
            initTable(data)
        },
    });
}
//填充表格数据
function initTable(data) {
    $("#cars").find("tr:not(:first)").remove();
    var tatalPrice = 0;
    var tatalPurchaseTax=0;
    $.each(data, function (key, value) {
        var appendval = "" + value.id + "" + value.carType + "" + value.carBrand + "" + value.carNumber + "" +
            value.carIdcode + "" + value.carPrice + "" + value.purchaseTax + "" + value.carCount + "" +
            value.carTotalprice + "" + "删除 " + "编辑" + ""
        tatalPrice = tatalPrice + value.carTotalprice;
        tatalPurchaseTax=tatalPurchaseTax+value.purchaseTax;
        $("#cars").append(appendval)
    });
    if (tatalPrice != 0 && carCount != 0) {
        var lastAppend = "" + "合计" + "" + "" + "" + "" +
            "" + "" +tatalPurchaseTax.toFixed(3)+ ""  + "" + tatalPrice.toFixed(3) + ""+(tatalPrice+tatalPurchaseTax).toFixed(3)+""
        $("#cars").append(lastAppend);
    }
}
//保存车辆信息
function saveCar() {
    if(!checkRate())return;
    $("#id").val("");//将id的值设空
    var paramdata = $('#carForm').serialize() + "&appno=" + appno;//serialize取不到jquery填充的值，算是个bug么？
    $.ajax({
        url: '/service/carManage/add',
        data: paramdata,
        type: 'post',
        success: function (data) {
            if (data === 'success') {
                init(appno);
            } else {
                alert("操作失败");
            }
        }
    })
}
//更新车辆信息
function updateCar() {
    if(!checkRate())return;
    var paramdata = $('#carForm').serialize() + "&appno=" + appno;//serialize取不到jquery填充的值，算是个bug么？
    $.ajax({
        url: '/service/carManage/update',
        data: paramdata,
        type: 'post',
        success: function (data) {
            if (data === 'success') {
                $("#editBtn").hide();//显示编辑按钮
                $("#btn").show();//隐藏保存按钮
                init(appno);
            } else {
                alert("编辑失败");
            }
        }
    })
}
//删除车辆
function deleteCar(id) {
    if(confirm("确认要删除？")){
        $.ajax({
            url: '/service/carManage/delete/' + id,
            type: 'delete',
            success: function (data) {
                if (data === 'success') {
                    init(appno);
                } else {
                    alert("删除失败");
                }
            }
        });
    }
}
//编辑车辆信息
function editCar(id) {
    $.ajax({
        url: '/service/carManage/find/' + id,
        success: function (data) {
            if (data === '') {
                alert("操作失败");
            } else {
                $('#carForm').formEdit(data);
                $("#editBtn").show();//显示编辑按钮
                $("#btn").hide();//隐藏保存按钮
            }
        }
    });
}
//填充表单数据
$.fn.formEdit = function (data) {
    return this.each(function () {
        var input, name;
        if (data == null) {
            this.reset();
            return;
        }
        for (var i = 0; i < this.length; i++) {
            input = this.elements[i];
            //checkbox的name可能是name[]数组形式
            name = (input.type == "checkbox") ? input.name.replace(/(.+)\[\]$/, "$1") : input.name;
            if (data[name] == undefined) continue;
            switch (input.type) {
                case "checkbox":
                    if (data[name] == "") {
                        input.checked = false;
                    } else {
                        //数组查找元素
                        if (data[name].indexOf(input.value) > -1) {
                            input.checked = true;
                        } else {
                            input.checked = false;
                        }
                    }
                    break;
                case "radio":
                    if (data[name] == "") {
                        input.checked = false;
                    } else if (input.value == data[name]) {
                        input.checked = true;
                    }
                    break;
                case "button":
                    break;
                default:
                    input.value = data[name];
            }
        }
    });
};
//校验
function checkRate() {
    var carPricet=$("#carPrice").val();
    var purchaseTax=$("#purchaseTax").val();
    var carCount=$("#carCount").val();
    if(isNaN(carPricet) || carPricet==''){
        alert("车辆单价请输入数字！");
        return false;
    }
    if(isNaN(purchaseTax) || purchaseTax==''){
        alert("购置税请输入数字！");
        return false;
    }
    if(isNaN(carCount) || carCount ==''){
        alert("购车数量请输入数字！");
        return false;
    }
    return true;
}