jQuery 实时保存页面动态添加的数据

需求：用户填写的东西，必须要实时保存

分析：监听用户操作事件，如：change、keyup 等，向后端发送请求

实际情况：

1. 用户填写的表单，是通过 JavaScript 动态新增的，这就需要使用为动态新增元素绑定事件。
2. 发送请求给后端，取决于前面的必填项是否已经完整填写。
3. 必须区分用户是动态新增了填写栏目呢？还是在修改？
4. 当前事件对象是什么？怎么通过该对象获取用户输入的数据？
5. 用户多次修改同一栏目，必须传送带有 ID 的数据给后端。目的，用于识别是新增，还是更新操作。

动态新增代码：

// template() 是一个模板格式化函数
$('#modal_pl_content').html(template('modal_temp', {data:''}));

模板代码：

事件监听与发送请求代码：

$(document).on("change keyup", ".cksd_comment_id", function(event) {   
/*   var current = event.target.tagName.toLowerCase();  
 if ((current != 'input') || (current != 'select')) {      
    event.preventDefault();   
  }  
*/   
 var praise_row = {};  
 praise_row.cpid_a = $("[name='cpid_a']").val();   
 praise_row.pt_a = $("[name='pt_a']").find("option:selected").val();  
 praise_row.dp_a = $("[name='dp_a']").find("option:selected").val();   
 praise_row.cptime_start = $("[name='cptime_start']").val();   
 praise_row.cptime_end = $("[name='cptime_end']").val();   
 praise_row.cpkeyword_a = $("[name='cpkeyword_a']").val();   
 praise_row.status = $("[name='cksd_status']").val();   
 if (praise_row.cpid_a && praise_row.pt_a && praise_row.dp_a && praise_row.cptime_start && praise_row.cptime_end) {      
    var comment_row = {};      
    $(this).find('input, select').each(function () {         
        var field = $(this).attr('name');         
        comment_row[field] = $(this).val();      
    });      
    var pp_id = $("input.cksd_praise_pid").val();      //console.log($(this));      
    var current_form = $(this);      
    var comment_id = $(this).children().find("[name='comment_update_id']").val();      
    var data = {};      
    if (pp_id) {         
        praise_row.id = pp_id;         
        comment_row.id = comment_id;         
        data = {praise: praise_row, comment: comment_row}      
    } else {         
        data = {praise: praise_row, comment: comment_row};      
    }      
    //console.log(data);      
    $.ajax({         
      type: 'post',         
      url: "",         
      data: data,         
      dataType: 'json'      
     }).done(function(res) {         
        if ((res.s == 0)) {            
          console.log($(this));            
          $('input.cksd_praise_pid').val(res.msg.p_id);            
          current_form.children().find("[name='comment_update_id']").val(res.msg.c_id);         
        }         
        console.log(res);      
    });   
}});