表格上出现一个框怎么删

表格是展示数据常用的工具，在原型制作时，我们经常会用到插入行和复制行的操作。那作者今天就教大家如何在Axure里用中继器表格制作出以下高保真的交互效果：

1. 插入行：在已选中行的下方插入一行空行
2. 复制行：在已选中行的下方插入一行与已选中行相同内容的行
3. 编辑行：可以编辑表格里的数据
4. 删除行：删除已选中的行
5. 自动编号：左侧序号根据当前行自动编号

原型地址：https://olzv8p.axshare.com/#g=1

一、材料准备

我们需要3个按钮组，分别为插入行、复制行和删除行，每个组由图标+文字组成，如下图所示：

表头我们用矩形来制作，案例中分依次为序号、姓名、语文、数学、英语……生物、历史，调整好尺寸和样式，如下图所示摆放：

表格内容我们用中继器来制作，中继器内部元件和表头一致，调整填充颜色，第一个序号的格子和表头一样用灰色，其他格子填充颜色为透明，增加一个禁用样式，线段为蓝色，后续输入时增加交互就可以有一个高亮的效果。然后可以设置中继器交替的背景色，这样单双行就有不同的颜色。

在每个白色矩形的上方放入一个文本框，填充颜色设置为透明，这样后续就可以在里面修改数据了。

最后我们增加一个透明颜色的背景矩形，包住整行，设置选中样式为浅蓝色，设置单选组，这样选中哪一条就会有一个高亮的效果了。

中继器表格里我们新增多列，分别为no和Column1-10。no对应表格的序号，Column1-10分别对应姓名、语文……历史10列的内容。

因为涉及到复制行，所以我们需要记录选中行表格的内容，所以我们新建多个文本标签，默认隐藏，不用于显示，只用于逻辑交互。分别为记录no，对应序号no列的内容；记录1-10，分别应用于记录姓名、语文……历史10列（Column1-10）对应的内容。

因为我们进入页面时默认选中第一行，所以记录no的文本默认为1。

二、交互制作

中继器每项加载时，我们用设置文本的交互，将表格中的值设置到对应的元件上，no列的值设置到灰色的矩形，Column1-10的值设置到对应的文本框内。

如果no列的值等于记录no文本里的值，我们还要把该行Column1-10的值分别设置到记录1-10的文本标签内。

中继器载入时，我们用排序事件，将中继器按no列升序排列，这样插入行的时候，我们通过控制插入行的no值，就可以控制在哪里插入了。

中继器内部元件组鼠标单击时我们用选中的交互，将背景矩形的选中状态设置为真，这样就实现了点击哪行，哪行变色的效果。

背景矩形被选中时，我们用设置文本的交互，将当前行no列的值设置到记录no的文本里，后续就可以根据这个序号来插入、复制或者删除行。

输入框获取焦点时，我们用禁用的交互，将输入框底部的矩形禁用，因为前面设置了禁用样式，所以就会有一个高亮的效果。然后我们同样设置背景矩形为真这样背景矩形也有一个高亮效果。

输入框失去焦点时，我们就反向操作，启用底部矩形。

最后我们还要用更新行的交互更新当前行对应的Column列的值为当前的文本值，1-10的文本框分别对应Column1-10。

鼠标单击插入行按钮组时，我们要知道在第几行插入，记录no里面就记录了第几行被选中，例如选中的是第三行，那我插入的应该是第4行，那原来的第四行就应该变成第5行一次类推。

所以我们要先用更新行的操作，将中继器no列的值大于记录no的文本值的所有行，都在原来的基础上增加1。这里相当于，如果选中第三行，那456……就变成了567……

这是空no值为4的行了，这是我们用添加行的交互，设置添加的行no列的值为记录no的文本值+1。

这样就完成添加新的行了。

鼠标单击复制行按钮组时，其实前面的都和插入行基本一样都是先更新已选中行下面序号的行，让他们序号+1，然后再插入一行新行，序号为记录no的文本值+1。不同的是上面插入的是空行，这里插入的是用内容的行，所以在添加行的时候，Column1-10列我们要分别插入记录no1-10的内容。

鼠标单击删除行按钮组时，我们用删除行的交互删除序号和记录no一样的行。

然后更新行的交互，更新序号大于记录no文本的行，让他们的序号变成原来序号的值减一。

例如我删了第四行，那原来的第五行就变成第四行，第六行就变成第五行，所以这里就是更新序号。

这样我们就完成了中继器表格插入行、复制行和删除行原型模板的制作了，下次使用时，只需要在中继器表格中填写或粘贴对应的信息，即可自动生成交互效果，是不是很方便呢？

那以上就是中继器表格插入行、复制行和删除行的全部内容了，感谢您的阅读，我们下期见~~~

本文由 @Axure高保真原型 原创发布于人人都是产品经理，未经许可，禁止转载。

题图来自 Unsplash，基于 CC0 协议。

该文观点仅代表作者本人，人人都是产品经理平台仅提供信息存储空间服务。

朱谢苏2949复制数据后表格出现一个小方框怎么也删除不掉?求助 -
羿选琴18791633264 ______ 先添加开发工具选项→然后点击开发工具栏→再点击设计模式图标(三角板、尺子、铅笔组合模样的)→点击选择要筛选的控件→删除

朱谢苏2949电子表格内经常出现一些不需要的文本框是怎么回事?怎样删除? -
羿选琴18791633264 ______ 那可能是你不小心点到下面的快捷方式了,你可以选中文本框然后点击键盘中的delete就可以了!

朱谢苏2949excel表格不知道按到什么了,出现了图上的那个框框,怎么去除掉 -
羿选琴18791633264 ______ 这个框应该是在工作表中的某个区域创建的列表. 框的取消方法:将鼠标移到如附表中“资料档案”单元格的上侧边缘 部,鼠标变成向下的小黑粗箭头时右击菜单,选中“列表”/“转换为区域”/“确定”附件:未命名.TIF

朱谢苏2949excel表格中有绘图的小框,怎么也删不了,怎么办?
羿选琴18791633264 ______ 分析一般情况下,不可能不能删除. 你删不掉的原因,可能有以下可能 1.方法不对.方法:选中绘图的小框-》按DELETE键删除;或者 选中-》右键-》剪切 2.还有一种可能,一般人会忽略:表不是你做的,而作表的人在一列上加了很多个同等尺寸(一般复制生成)的小框,当后面的人删除前面的行时,绘图的小框不会一并删除,而是上移叠加在一起,看上去像一个,这样当你删除上面一个后,下面一个露了出来,给你感觉想没删除一样,实际却是删除了,所以要想知道是不是这种可能,只要把上面一个移到旁边,看下边还有没有,就知道了.解决办法:如果想保留原表,继续删除即可,否认,将表内容复制-》先选择性粘帖数字-》再选选性粘帖格式.

朱谢苏2949EXCEL里怎么把这个框框删掉,急!!!2007版!!! -
羿选琴18791633264 ______ 不知道你说的是哪个框框,表格框就是看表格属性里面,有表格框的编辑,其他的画上去的框,就选中用剪切(一定要保持选中状态,也就是要在对象上按鼠标右键,实在不会就中择后用上边菜单的剪切),或者选择后按del键.

朱谢苏2949在word中制作表格后会有一条框线如何删除 -
羿选琴18791633264 ______ 选中整个表格,按右键,选“底纹和边框”,选第一个选项即无边框,应用或确定.

朱谢苏2949做表格的时候中间出现的那个隐藏框框怎么样全部删除?做表格的时候中
羿选琴18791633264 ______ 那个是粘贴选项按钮 在 工具菜单 选项 编辑 右边一点 有一个大概 显示粘贴选项, 单击一下,前面的勾没有起作用了,如果你再要到到它单击一下 有的时候还会的一个自动更正的选项图标出现 也是在 工具菜单 选项 拼写检查 自动更正 按钮 点开来第一个的勾去掉

朱谢苏2949怎样删除word表格中的上框线 -
羿选琴18791633264 ______ 在编辑Word文档时,常需要在文档中添加页眉页脚,但此时Word会自动在文字下方加一横线.我们想去掉这根横线,有两种方法可快速删除页眉横线. 方法一:双击页眉区域,出现页眉编辑虚线框,在菜单“编辑---清除”下找到“格式”项,单击,则页眉中的横线消失,只留下文字信息.想要恢复横线,点击“编辑”菜单的“撤销键入”项即可. 方法二:双击页面区域后,点击“格式---边框和底纹”,在“边框”标签页中的左侧的边框“设置”中点击“无”,在右边找到“应用于”组合框,选择“段落”,点击“确定”命令按钮,则页眉中的横线消失.

朱谢苏2949excel表格怎么删除列的线框 -
羿选琴18791633264 ______ 有两种情况: 1.是两条边框线,取消时,选中所有单元格,右键,设置单元格格式,选择 边框,然后选择 预置下面的 无 确定即可. 2.是冻结窗格的线,菜单---窗口---取消冻结窗格.

朱谢苏2949表格里出现一个长方形的方框和一个正方形的方框,如图.这些东西是什么?怎么删除掉? -
羿选琴18791633264 ______ 应该是你在上面复制来粘贴去,导致上面很多小表格叠在一起.解决办法:在表格别的地方选取复制完整的、没有编辑过的区域(最好范围大点),再粘贴到出问题的区域. 望采纳