Javascript 捕获页面标题、控件标签的通用方法

我们的一位客户提出了一个新要求，即动态捕获页面/屏幕标题以及用户交互页面上所有控件（文本框、复选框、单选按钮、普通按钮、链接、图像、菜单/菜单项）的标签，然后将其推送到excel文件中

如果客户导航/打开页面a并在文本框Name=John中设置一个值，启用复选框chbox/单选按钮Rbutton，然后最后单击保存/提交按钮，则预期会出现以下输出。用户操作和结果位于Excel文件的前两列

**用户操作****结果**
打开页面/屏幕A显示页面/屏幕A
Set textbox Name=John字段名设置成功
成功启用Set ChBox=true ChBox
Set Rbutton=true成功启用Rbutton
单击“提交”按钮，将显示页面B

---

只是想知道是否有可能实现这种捕获任何页面的用户交互的通用方法

这只是一个想法：您可以监听所有事件（例如jquery），然后为每个“感兴趣”的事件发布ajax请求（您必须过滤…），将其存储在数据库中，然后添加csv或excel格式的“导出”函数

可能有一些性能问题，这取决于页面、事件和用户的数量

---

多亏了Hasan Iqbal Anik，使用类名进行过滤的想法很好。

Javascript无法在硬盘中写入文件。但是，您可以捕获数据，创建模型，然后使用ajax调用将其存储在服务器中

一些想法：

使用在整个应用程序视图中呈现的布局或母版页

为所有页面标签、按钮、复选框和任何需要存储信息的内容指定相同的类名

在master/layout页面中使用一些jquery魔术来获取这些元素的值并生成一个数组

通过ajax调用将该数组发送到服务器 现在您可以获得大量关于如何使用jquery获取元素值的示例。我在救你，不让你付出那么多。希望这有助于D

//编辑：我正试图按照史蒂夫的要求扩展我的答案

<form action="someAction" id="myForm">
Name: <input type="text" class="Name">
Checkbox: <input type="checkbox" class="ChBox"/>Click this box
RButton: <input class="Rbutton" type="radio" />
Submit: <input type="submit" class="submit"/>
</form>

---

你好，安东尼。web应用程序已交付给客户，但客户希望在web应用程序中进行某种增强/提供，以生成包含上述两列的excel文件。您的客户提出的要求在某种程度上是可能的，但需要实现PITA。请注意，您必须跟踪客户端的每个用户操作以及服务器端的一些操作，并可能将所有这些信息保存在数据库中，并以Excel格式提供报告。他们是否希望能够下载表中记录的csv/Excel文件？嗨，Luiggi和Antony。谢谢你的回复。是的，客户希望下载一个excel文件，一旦他停止与预期的2列应用程序交互，并且根据与应用程序交互/事件的类型，这些列下面的文本，那么您的客户就疯了。在我看来，我会放弃这一要求，因为开发和维护的高成本以及应用程序的性能将下降到世界的另一端（是的，讽刺的是，但你明白了）。嗨，哈桑，非常感谢你的回复。你能再详细一点吗。我过去没有这样做过。顺便说一下，客户不希望输出进入数据库，然后从那里导出到excel。他想要的是创建一种开关类型的东西来打开可以直接在客户端计算机上跟踪并导出到excel文件的功能/特性。嗨，Thierry，非常感谢您的回复。你能再详细一点吗。我过去没有这样做过。顺便说一下，客户不希望输出进入数据库，然后从那里导出到excel。他想要的是创建一种开关，打开可以直接在客户机上跟踪并导出到excel文件的功能/特性。你不能在客户机上创建文件。出于安全原因，您不能访问文件系统。很抱歉，当我说客户机时，我指的是使用浏览器与应用程序交互的机器。对不起，这不是客户的机器我也谈到这台机器。。。显示在浏览器中的web应用程序无法访问文件系统。

$(function() {
     $(".submit").click(function(){
var dataToSend = new Object();
dataToSend.pageUrl = window.location.pathname + " is displayed";
if ($(".Name").val().length > 0) {
dataToSend.Name = "Field Name is set successfully";
}
else {
dataToSend.Name = "Field Name is empty";
}
if($(".ChBox").is(':checked')){dataToSend.ChBox = "ChBox is enabled successfully";}
else{dataToSend.ChBox = "ChBox is not enabled";}
if($(".Rbutton").is(':checked')){dataToSend.Rbutton = "Rbutton is enabled successfully";}
else{dataToSend.Rbutton = "Rbutton is not checked";}
dataToSend.Submit = $("#myForm").attr['action'] + " is displayed";
});


//now send it to the server via ajax

$.ajax({
 type: "POST",
 url: "your server action url that would make excel file with these data",
 data: dataToSend,
 contentType: "application/json; charset=utf-8",
 dataType: "json",
 success: function(msg) {
//do as you wish
 }
});

    });