动态更改html表格以在移动设备上显示

Question

我正在创建一个移动设备优化网站，该网站通过识别来自移动设备的请求动态创建，操纵现有页面以使用php和html解析器QueryPath进行移动优化。 我打算处理的一些页面包含html表格，例如this one，它们在移动设备上不能很好地显示。

我正在寻找一个函数，可以处理任何数量的行和列的任何html表格，并操纵它，以便它在移动设备上显示格式良好。我正在使用jquery移动框架。

php或javascript/jquery中的解决方案会很棒。

这里是我的意思一个的jsfiddle：Link

Answer 1

我已经使用这个响应表方法从丝 - responsive tables，demo ，把它变成一个jQuery Mobile的“扩展”之称的tableview - 见here。

要使用它，您只需在HTML标记内指定哪些列最重要，最不重要，然后添加相应的JQM触发器，其余的扩展则处理其余部分。根据屏幕大小，显示优先级列，而其他列是隐藏的。

我将原始示例中的“显示”按钮和菜单更改为JQM自定义选择，您可以根据需要切换列，添加过滤器（与JQM listview相同），可排序标题（仅嵌入按钮，没有功能），动态复选框，突出显示和其他一些东西。

该扩展没有完成，不包含任何逻辑（排序，分页等），除了过滤器。

我也在研究一个datatables.net版本的tableview。让我知道，如果你需要一个这样的工作例子。或多或少地完成。