首页 / 脚本样式 / JavaScript / jquery表单自动转Json实现方法

<style type="text/css">

.layui-layer-content {

    padding: 10px;

}

.row{padding: 5px 0px;}

</style>

<div class="ibox">

    <div class="ibox-content">

        <form id="forms" enctype="multipart/form-data">

            <div class="row">

                <label for="uname">填报人：</label>

                <div class="column">

                    <input type="text" name="uname" id="uname" value="" />

                </div>

            </div>

            <div class="row">

                <label for="dtime">填报时间：</label>

                <div class="column">

                    <input type="text" name="dtime" id="dtime" value="" />

                </div>

            </div>

            <div class="row">

                <label for="summary">工作总结：</label>

                <div class="column">

                    <input type="text" name="summary" id="summary" value="" />

                </div>

            </div>

            <div class="row">

                <label for="keys">工作计划：</label>

                <div class="column">

                    <input type="text" name="plan" id="plan" value="" />

                </div>

            </div>

            <div class="row">

                <div class="column column_btn">

                    <button id="saveBtn">保存</button>

                </div>

                <div class="column column_btn">

                    <button id="cancelBtn">取消</button>

                </div>

            </div>

        </form>

    </div>

</div>

<script type="text/javascript">

$(function() {

    $("#cancelBtn").click(function() {

        layer.close(openLayer);

    });

    $("#saveBtn").click(function() {

        var json=formjson("forms");

        console.log(json);

        return false;

    })

    //将表单转JSON操作

    function formjson(formname) {

        var params = $("#"+formname).serializeArray();

        var jsonObj = {};

        $(params).each(function() {

            jsonObj[this.name] = this.value;

        });

        return JSON.stringify(jsonObj);

    }

})

</script>