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条)

报告相同问题?

悬赏问题

  • ¥15 关于#hadoop#的问题
  • ¥15 (标签-Python|关键词-socket)
  • ¥15 keil里为什么main.c定义的函数在it.c调用不了
  • ¥50 切换TabTip键盘的输入法
  • ¥15 可否在不同线程中调用封装数据库操作的类
  • ¥15 微带串馈天线阵列每个阵元宽度计算
  • ¥15 keil的map文件中Image component sizes各项意思
  • ¥20 求个正点原子stm32f407开发版的贪吃蛇游戏
  • ¥15 划分vlan后,链路不通了?
  • ¥20 求各位懂行的人,注册表能不能看到usb使用得具体信息,干了什么,传输了什么数据