生成表单

课后整理 2021-2-25

在writeform.js脚本文件中包含一个writeform(table)的函数,它能够根据参数所指定生成的表,会自动生成对应的表单域,详细代码如下。

//===================================
//生成表单
//===================================
//参数说明:table-生成的表单对应的数据表,字符串
//返回值:返回一个对象集合
//html: 生成的HTML片段,DOM对象
//table:表单对应的数据表名称,字符串
function writeform(table){
    
    var html = "";//返回的HTML字符串
    //条件判断,确定返回什么类型的表单结构,写入记录表单
    if(table == "income" || table == "out" || table == "blog" ){
        html += '<form id="addform" name="addform" method="post" action="#" onsubmit="return false;">';
        html += ' <fieldset id="addbox">';
        html += ' <legend>'+ menuobj[table][1] +' </legend>';
            if(table != "blog"){
                html += ' <label for="price">金额';
                html += ' <input type="text" name="price" id="price" />';
                html += ' </label>';
            }
        html += ' <label for="class">分类';
        html += ' <select name="class" id="class">';
        html += ' </select>';
        html += ' </label>';
        html += ' <label for="remark"><span>备注</span>';
        html += ' <textarea name="remark" id="remark" ></textarea>';
        html += ' </label>';
        html += ' <span id="detail"></span>';        
        html += ' <input type="reset" name="reset" id="reset"  value="重写" /> ';
        html += ' <input type="submit" name="save" id="save" value="保存记录" />';    
        html += ' </fieldset>';
        html += ' </form>    ';
    }
    //分类管理
    else if(table == "class"){
        //代码省略,请参阅光盘示例
    }
    //代码省略,请参阅光盘示例
    //返回表单结构字符串,以及操作表的名称
    return { html: html, table: table };    
}