jQuery如何在表格中添加或者删除下一行

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery如何在表格中添加或者删除下一行相关的知识,希望对你有一定的参考价值。

参考技术A html代码
<div>
<table>
<tr><td>1111</td><td><input type="button" value="添加下一行" /><input type="button" value="删除下一行" /></td></tr>
<tr><td>2222</td><td><input type="button" value="添加下一行" /><input type="button" value="删除下一行" /></td></tr>
<tr><td>4444</td><td><input type="button" value="添加下一行" /><input type="button" value="删除下一行" /></td></tr>
</table>
</div>

jQuery代码

<script type="text/javascript" src="Scripts/jquery-1.4.1.js"></script>
<script type="text/javascript">
$(document).ready(function ()
ModifyClick();
);
function ModifyClick()
$("table tr input[type='button'] ").each(function ()
$(this).unbind("click");
$(this).bind("click", function ()
if ($(this).val() == "添加下一行")
$(this).parent().parent().after("<tr><td>Add</td><td><input onclick=\"ModifyClick()\" type=button value=\"添加下一行\" /><input onclick=\"ModifyClick()\" type=button value=\"删除下一行\" /></td></tr>");

if ($(this).val() == "删除下一行")
$(this).parent().parent().next().eq(0).remove();

);
);

</script>
参考技术B 添加:$("talbe").append("<tr></tr>");
删除 $("tr").remove();

如何删除最后一行并在表格视图中添加更多行?

【中文标题】如何删除最后一行并在表格视图中添加更多行?【英文标题】:How to delete the last row and add more rows in the tableview? 【发布时间】:2012-03-18 13:01:11 【问题描述】:

tableview的最后一行有一个按钮,当按下它时,我希望该行中的按钮消失,同时添加更多行,然后按钮再次出现在最后一行。 但我不知道怎么做! 这是我的代码:

- (void)morePicture:(id)sender
NSMutableArray *indexpath = [[NSMutableArray alloc] init];
[photos removeObjectAtIndex:[photos count]-1];
[indexpath addObject:[NSIndexPath indexPathForRow:[photos count]+1 inSection:0]];
[table beginUpdates];
[table deleteRowsAtIndexPaths:indexpath withRowAnimation:UITableViewRowAnimationNone];

NSMutableArray *indexPathss = [[NSMutableArray alloc] init];
for(int i=0; i<3; i++)
    NSString *s = [[NSString alloc] initWithFormat:@"%d",i];
    [photos addObject:s];
    NSIndexPath *indexpath = [NSIndexPath indexPathForRow:i inSection:0];
    [indexPathss addObject:indexpath];

【问题讨论】:

这段代码对你有用吗?如果 photos 是您的数据源,那么您似乎正在尝试删除 indexPath 行中大于源中项目数的行([photos count]+1 应该是 [photos count])。 如果按钮始终是表格中的最后一项,则将其放在表格的页脚视图中可能会更容易。这样它就会一直在底部。 【参考方案1】:

您不需要调用deleteRowsAtIndexPaths 方法。请改用insertRowsAtIndexPaths。只需在最后一行按钮上方添加行,不要删除它!

NSArray *newPhotos = ....;
NSMutableArray *photos = ...;

// insert new photos first (before table update)
[photos insertObjects:newPhotos atIndexes:[NSIndexSet indexSetWithIndexesInRange:NSMakeRange([photos count] - 1, [newPhotos count])];

NSMutableArray *newIndices = [NSMutableArray array];
for (NSInteger row = [photos count] - [newPhotos count] - 1; row < [photos count] - 1; row++) 
    [newIndices addObject:[NSIndexPath indexPathWithIndex:row];

[self.tableView insertRowsAtIndexPaths:newIndices withRowAnimation:UITableViewRowAnimationFade];

【讨论】:

但是,在我按下按钮后,它会添加更多行,但按钮不会再次显示【参考方案2】:

UIButton *moreButton = [[UIButton alloc] initWithFrame:frame];

[moreButton setImage:[UIImage imageNamed:@"button_signin.png"] forState:UIControlStateNormal];

[moreButton addTarget:self action:@selector(showMoreRows) forControlEvents:UIControlEventTouchUpInside];

// 将按钮添加到表格页脚视图

self.tableView.tableFooterView = moreButton;

在方法中

-(IBAction) showMoreRows

//在数组中添加对象,该对象负责创建表视图,然后调用

[self.tableView reloadData];

【讨论】:

对了,如何设置页脚视图的高度? 可以设置按钮j的Frame

以上是关于jQuery如何在表格中添加或者删除下一行的主要内容,如果未能解决你的问题,请参考以下文章

jquery给表格动态添加删除行后如何获取数据

一个radio在一行表格中。如何用JQuery,JS选择了radio后,获取那一行的属性。并在页面删除那一行

如何删除最后一行并在表格视图中添加更多行?

协助表格添加行中的值并使用按钮删除它们。使用 jQuery

javascript添加或者删除table表格行代码实例

如何添加链接以编辑和删除使用php制定的表格中的每一行