0

我想创建一个数据表，每当单元格/行上发生鼠标悬停事件时，我将能够弹出与单元格中的数据相关的操作的上下文菜单/按钮。

示例：如果我在 a 列中有用户名，则每当用户将鼠标移到该单元格上时，它将显示按钮“详细信息”、“更新”和“删除”。如果我有一个地址列，每当用户将鼠标移到该地址单元格上时，我都会弹出一个说...谷歌地图或其他东西。

我将使用带有 Ext.NET 或 JQuery 的 ASP.NET MVC 4 来实现这一点。任何一个例子都是受欢迎的。谢谢！

注意：不需要详细的代码，但欢迎使用代码片段。

4

1 回答 1

1

首先，我认为从可用性的角度来看，在悬停时显示操作按钮并不是一个好主意——因为你需要悬停才能发现有操作——有些人可能会查看表格并且不知道要做什么下一步，只是偶然发现实际上隐藏了一些按钮。

我会考虑使用现有的网格之一——Telerik 的 mvc 网格很棒——尤其是因为它们有很好的客户端 API——你可以用它来实现你想要的，虽然要花钱——但真的值得一试—— http://demos.kendoui.c​​om/web/grid/index.html。

还有 Grid.Mvc - 它是开源且可用的，尽管客户端 API 较弱：http ://gridmvc.codeplex.com/wikipage?title=Client%20side%20%28javascript%29&referringTitle=Documentation

要实现您所需要的，您需要将其拆分为任务：

1）检测悬停事件，为此您可以使用jQuery - http://api.jquery.com/hover/
2）检测您所在的列，可能会在表头上使用一些数据属性，您可以找到使用 jQuery 的列标题如下：

var $th = $td.closest('tbody').prev('thead').find('> tr > th:eq(' + $td.index() + ')');

3）根据您所在的列切换您的逻辑
4）使其可重用:)

于 2013-10-02T07:05:19.600 回答