jQuery对json快速赋值

jQuery对json快速赋值,重点在于将input的id取跟JSON同样的名称。

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>jQuery对json快速赋值</title>
    <!--引用jQuery库-->
    <script src="js/jquery-1.11.3.min.js"></script>
</head>
<body>
<div>
    姓名:<input type="text" id="name">
    出生日期:<input type="date" id="birthday">
    其他:<input type="text" id="other">
</div>
<div>
    性别:<input type="hidden" id="sex">
    <input type="radio" name="user_sex" value="男"><input type="radio" name="user_sex" value="女"></div>
<button id="btn">按钮</button>
<script>
    $(function () {
        $('#btn').on('click',function(){
            json_assignment();
        });
        radio_event();
        //性别单选值赋给input
        function radio_event(){
            //checkbox或select都可以用同样的方法
            $('input[name="user_sex"]').on('change', function () {
                var tt=$('#sex');
                tt.val($("input[name='user_sex']:checked").val())
            })
        }
        function json_assignment(){
            var con={name:'',birthday:'',other:'',sex:''};
            var parse={name:'姓名',birthday:'出生日期',sex:'性别'};
            for(var ii in con){
                con[ii]=$('#'+ii).val();
                if(con[ii]==''){
                    if(ii in parse){
                        alert(parse[ii]+'不能为空');
                        return;
                    }
                }
            }
            //控制台输出
            console.log(con);
        }
    });
</script>
</body>
</html>

第一篇博客,希望跟大家好好交流。

posted @ 2016-08-01 23:46  赤羽飞鸿  阅读(6129)  评论(0编辑  收藏  举报