jquery——雙擊編輯非同步更新(雙擊內容變input框可編輯，失去焦點後修改的資料非同步提交)
阿新 • • 發佈：2019-02-03
$(function() {
$("tbody>tr>td").dblclick(function(){
var inval = $(this).html(); //獲得td裡的html內容
var infd = $(this).attr("fd"); //獲得td的fd屬性的值
var inid = $(this).parent().attr("id"); //獲得td的父節點id屬性的值
//把td裡的html內容變為input框，並賦值
$(this).html("<input type='text' id='edit"+infd+inid+"' value='"+inval+"'>");
//input框獲得焦點，以及失去焦點後的處理
$("#edit"+infd+inid).focus().live("blur",function() {
var editval = $(this).val(); //獲得input框中的值
$(this).parent().html(editval); //把得到的值賦給input框父節點的html
//post表單提交
$.post("jquery_dblclick.php",{id:inid,fd:infd,val:editval},function(data) {
alert(data);
})
})
})
})
$("tbody>tr>td").dblclick(function(){
var inval = $(this).html(); //獲得td裡的html內容
var infd = $(this).attr("fd"); //獲得td的fd屬性的值
var inid = $(this).parent().attr("id"); //獲得td的父節點id屬性的值
//把td裡的html內容變為input框，並賦值
$(this).html("<input type='text' id='edit"+infd+inid+"' value='"+inval+"'>");
//input框獲得焦點，以及失去焦點後的處理
$("#edit"+infd+inid).focus().live("blur",function() {
var editval = $(this).val(); //獲得input框中的值
$(this).parent().html(editval); //把得到的值賦給input框父節點的html
//post表單提交
$.post("jquery_dblclick.php",{id:inid,fd:infd,val:editval},function(data) {
alert(data);
})
})
})
})