亚洲激情专区-91九色丨porny丨老师-久久久久久久女国产乱让韩-国产精品午夜小视频观看

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

使用jQuery怎么實時保存頁面動態添加的數據

發布時間:2021-06-23 17:12:12 來源:億速云 閱讀:126 作者:Leah 欄目:web開發

使用jQuery怎么實時保存頁面動態添加的數據,相信很多沒有經驗的人對此束手無策,為此本文總結了問題出現的原因和解決方法,通過這篇文章希望你能解決這個問題。

實際情況:

  • 用戶填寫的表單,是通過 JavaScript 動態新增的,這就需要使用為動態新增元素綁定事件。

  • 發送請求給后端,取決于前面的必填項是否已經完整填寫。

  • 必須區分用戶是動態新增了填寫欄目呢?還是在修改?

  • 當前事件對象是什么?怎么通過該對象獲取用戶輸入的數據?

  • 用戶多次修改同一欄目,必須傳送帶有 ID 的數據給后端。目的,用于識別是新增,還是更新操作。

動態新增代碼:

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

模板代碼:

<script id="modal_temp" type="text/html">
<form class="cksd_comment_id">   
  <div class="col-sm-12 addID">
    <input type="hidden" name="comment_update_id" value="" />   
    <div class="col-sm-12 hr hr-18 dotted hr-dotted"></div>
    <div class="col-sm-3 form-group">        
      <label class="col-sm-3 control-label no-padding-right">評價ID</label>      
      <div class="col-sm-9"><input type="text" class="col-xs-12" name="commentID"></div>     
    </div>     
    <div class="col-sm-1 form-group">      
      <select name="star" onchange="checkIsInput(this)">        
        <option value="5">5</option>        
        <option value="4">4</option>        
        <option value="3">3</option>        
        <option value="2">2</option>        
        <option value="1">1</option>      
      </select>     
    </div>     
    <div class="col-sm-4 form-group">        
      <label class="col-sm-3 control-label no-padding-right">當前數量</label>      
      <div class="col-sm-8">        
        <div class="col-sm-5"><input type="text" class="col-xs-12" name="now_yes" onkeyup="is_intdata(this,this.value)" value="0"></div>          
        <label class="col-sm-1 control-label no-padding-left no-padding-right">of</label>        
        <div class="col-sm-5"><input type="text" class="col-xs-12" name="now_total" onkeyup="is_intdata(this,this.value)" value="0"></div>      
      </div>    
    </div>      
    <div class="col-sm-3 form-group">        
      <div class="col-sm-12">          
        <label class="col-sm-1 control-label no-padding-left no-padding-right">Yes</label>          
        <div class="col-sm-5"><input type="text" class="col-xs-12" name="add_yes" onkeyup="is_intdata(this,this.value)" value="0"></div>          
        <label class="col-sm-1 control-label no-padding-left no-padding-right">No</label>          
        <div class="col-sm-5"><input type="text" class="col-xs-12" name="add_no" readonly onkeyup="is_intdata(this,this.value)" value="0"></div>
      </div>      
    </div>    
    <div class="col-sm-1 form-group">總數: <br><span class="total_yes">0</span> of <span class="totals">0</span></div>     
    <div class="col-sm-1 form-group delbox"><button type="button" class="btn btn-danger btn-xs" onclick="delPlID(this)">刪除</button></div>   
  </div>  
</form>
</script>

事件監聽與發送請求代碼:

$(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: "<?php echo site_url('/praise/save_intime');?>",     
   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);   
  });  
}});

看完上述內容,你們掌握使用jQuery怎么實時保存頁面動態添加的數據的方法了嗎?如果還想學到更多技能或想了解更多相關內容,歡迎關注億速云行業資訊頻道,感謝各位的閱讀!

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

繁昌县| 嘉义县| 汪清县| 荔波县| 呼图壁县| 临城县| 同江市| 南宫市| 苗栗县| 定陶县| 马鞍山市| 清丰县| 白朗县| 如皋市| 宜阳县| 南漳县| 志丹县| 兴海县| 广汉市| 贞丰县| 隆林| 连州市| 黑龙江省| 迁安市| 长治市| 昭平县| 凌海市| 平阴县| 铜陵市| 陆川县| 扎兰屯市| 含山县| 秭归县| 五寨县| 呼伦贝尔市| 永修县| 陇南市| 沙坪坝区| 水富县| 吉木乃县| 临夏市|