table下的表格实现双击变为文本框,利用ajax提交表单
发布时间:2020-12-16 03:27:46 所属栏目:百科 来源:网络整理
导读:前些日子在公司里遇到一个需求,如题,所以分享一下写法: JS: //双击触发的事件 function dbl_c () { $( ".td1" ).dblclick( function () { var td = $( this ); var text = $.trim(td.text()); var txt = $( "input type='text' " ).val(text); txt.blur(
前些日子在公司里遇到一个需求,如题,所以分享一下写法: JS: //双击触发的事件
function dbl_c(){
$(".td1").dblclick(function(){
var td = $(this);
var text = $.trim(td.text());
var txt = $("<input type='text' >").val(text);
txt.blur(function(){
var rdremark = $(this).val();
//获取同行不同列的值,通过当前对象的父节点的父节点(td->tr->table)获取td类名applyid这一列的遍历
var applyid = $(this).parent().parent().find("td.applyid:eq(0)").text();
alert("当前申请编号为:" + applyid + ",审核阅读标注修改成功!");
$.ajax({
url : "xxxx(此处是你的action)",data : {"applyid" : applyid,"rdremark" : rdremark},type : "post",async : true,cache : false,dataType : "json",success : function(){
//这里是成功后的执行函数
}
});
var newText = $(this).val();
$(this).remove();
td.text(newText);
});
td.text("");
td.append(txt);
txt.focus();
});
}
表格: <td class="td1" ondblclick="dbl_c()" ><%=PageTools.StringFromObject(map.get("rdremark")) %></td>
最后的效果就是在现实的表格中,你所做的对应的双击事件单元格处双击,即可变为文本框,鼠标点击别处,既可恢复为单元格。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |