javascript - 将多列 html 表转换为单列以实现移动友好布局

标签 javascript jquery html dom jquery-selectors

我有一个包含 3 列的表格。我想转换为单行。

enter image description here

both append.('</tr><tr>') and after.('</tr><tr>') do not work.

移动友好页面需要这样 -

enter image description here

感谢您的帮助!

http://jsfiddle.net/tZt3Q/

最佳答案

实现此目的的一种方法是使用 JQuery wrap 方法。请参阅 Wrap UnWrap

Demo

Demo W/O class

 $(document).ready(function () {
    var tbl = $("table");
      $('td','table').unwrap().each(
     function () {     
          tbl.append($(this).wrap('<tr>').parent()); 
    });
  });

更简单的一个:

 $(document).ready(function () {
    $('table').find('td').unwrap().wrap($('<tr/>'));
});

Fiddle

关于javascript - 将多列 html 表转换为单列以实现移动友好布局,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16043045/

相关文章:

javascript - react-native 图像不适用于 android

javascript - 单击链接时如何清除输入元素?

javascript - 动画元素,但保持容器居中

javascript - jQuery 中的匿名函数语法

jquery - 应用于 Jquery Datepicker 的表格 CSS

javascript - 当弹出窗口完成父级启动的加载时,如何通知父级页面?

javascript - 谷歌标签管理器 : Tracking "Select" Drop Down Menu "Option" tag value

javascript - 在 iFrame 之间传递变量 ColdFusion

javascript - 如何去掉下载图片时显示的问号?

php - MySQL 和 BLOB 字段无法从 PHP 上传/显示图像(但它可以手动工作)/二进制/十六进制转储?