Jquery 渲染表单

旧城冷巷雨未停 提交于 2019-12-06 10:25:49

<script>
        var data = { "txt": "leungs", "ckb": "2", "rdo": "2", "sel": "3", "area": "sentens","title":"render form demo..." };
        $(function () {
            $("[col]").each(function () {
                var col = $(this).attr("col");
                var type = $(this).attr("type");
                if (type) {
                    switch (type) {
                        case "checkbox":
                            var ckb_checked = $(this).attr("value") == data[col] ? true : false;
                            $(this).attr("checked", ckb_checked);
                            break;
                        case "radio":
                            var rdo_checked = $(this).attr("value") == data[col] ? true : false;
                            $(this).attr("checked", rdo_checked);
                            break;
                        default:
                            $(this).val(data[col]);
                            break;
                    }
                } else {
                    $(this).html(data[col]);
                }

            });
        });
    </script>

<body>
    <form id="form1" runat="server">
    <div>
        <h1 col="title"></h1>
        <input type="text" col="txt" /><br />
        <input type="checkbox" col="ckb"  value="1" /> <input type="checkbox"  value="2" col="ckb" /> <input type="checkbox" value="3" col="ckb" /><br />
        <input type="radio" col="rdo" value="1" name="rdo_sex" /> <input type="radio" value="2" col="rdo" name="rdo_sex" /><br />
        <select col="sel">
            <option value="1">A</option><option value="2">B</option><option value="3">C</option>
        </select><br />
        <textarea col="area">
            
        </textarea><br />
    </div>
    </form>
</body>




标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!