jquery即点即改

Html

Css


    
    IDcard
    Name
    Address
    

        1
        秦计虎
        河北省邯郸市曲周县
    
    
        2
        宋莹莹
        河北省邯郸市曲周县

IDcard	Name	Address
1	秦计虎	河北省邯郸市曲周县
2	宋莹莹	河北省邯郸市曲周县

 td {
	border:1px solid #0094ff;
	text-align:center;
}

$(function() {
    $(document).on("click", ".gai", function() {
        //不重复
        if ($(this).children("input").prop("type") == 'text') return false;
        //获取文本
        var data = $(this).html();
        //替换为文本框+文本
        var input = '<input type="text" id="ai" value="' + data + '">';
        $(this).html(input);
        //获取光标
        $(this).children("input").focus();
    });
    $(document).on("blur", "#ai", function() {
        //修改后的内容
        var data = $(this).val();
        //修改的ID
        var id = $(this).parents("tr").prop("id");
        //修改的字段
        var param = $(this).parent().attr("param");
        alert("修改的ID：" + id + "|" + "修改的字段：" + param + "|" + "修改后的内容：" + data);
        var obj = $(this);
        //发送AJAX
        // $.ajax({
        //     type:"post",
        //     url:"",
        //     data:{
        //         "data":data,
        //         "id":id,
        //         "param":param
        //     },
        //     success:function(data){
        //         if(data==1){
        obj.parent().html(data);
        //       }
        //   }
        //})
    })
})

↑上面代码改变，会自动显示代码结果 jQuery调用版本：1.8.3

立即下载

jquery即点即改



代码描述：基于jQuery的即点即改，简单实用，完整的，包括发送请求！

更新时间：2020-10-13 00:03:35
有详细的注释，新手一看就懂！

0

最新

发表评论全部评论

暂时没有评论！

登录后才可以评论

30秒后在评论吧!

PROMULGATOR

12.20@

相关代码

jquery即点即改

最新