GreenRookie 2016-07-19 08:32 采纳率: 86.7%
浏览 4158
已采纳

jquery 如何把table中的一行变成可编辑的,并本身td的值存在

在做表单编辑时候,想编辑单个tr里面td值。
图片说明
这是表单

1 2
2 5
3 8
4 2

当我点击编辑时候 当前行的td可以编辑 求方法

  • 写回答

2条回答 默认 最新

  • Go 旅城通票 2016-07-19 08:38
    关注
     <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.3.min.js"></script>
    <style>
        #tb .text{width:100%;border:none;}
    </style>
    <table id="tb">
        <tr><td>1</td><td>2</td><td><input type="button" value="编辑"></td></tr>
        <tr><td>2</td><td>5</td><td><input type="button" value="编辑"></td></tr>
        <tr><td>3</td><td>8</td><td><input type="button" value="编辑"></td></tr>
        <tr><td>4</td><td>2</td><td><input type="button" value="编辑"></td></tr>
    </table>
    <script>
        $('#tb :button').click(function () {
            var toEdit = this.value == '编辑';
            this.value = toEdit ? '确定' : '编辑';
            $(this).closest('tr').find('td').not(':last').each(function () {
                if (toEdit) this.innerHTML = '<input class="text" type="text" value="'+this.innerHTML.replace(/"/g,'&quot;')+'"/>';
                else this.innerHTML = this.firstChild.value.replace(/</g, '&lt;').replace(/>/g, '&gt;');
            });
        });
    </script>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

悬赏问题

  • ¥30 这是哪个作者做的宝宝起名网站
  • ¥60 版本过低apk如何修改可以兼容新的安卓系统
  • ¥25 由IPR导致的DRIVER_POWER_STATE_FAILURE蓝屏
  • ¥50 有数据,怎么建立模型求影响全要素生产率的因素
  • ¥50 有数据,怎么用matlab求全要素生产率
  • ¥15 TI的insta-spin例程
  • ¥15 完成下列问题完成下列问题
  • ¥15 C#算法问题, 不知道怎么处理这个数据的转换
  • ¥15 YoloV5 第三方库的版本对照问题
  • ¥15 请完成下列相关问题!