javascript - 添加时在一行中的两列中显示两个表

标签 javascript jquery html css dropzone.js

我正在使用 DropzoneJS,我希望自定义模板。

我的模板如下:

<div id="previewTemplate" style="display:none;">
    <table class="dz-preview">
        <tr>
            <td class="col-md-10">
                 <a href="#" class="dz-filename" data-dz-name=""></a>
            </td>
            <td class="col-md-2">
            X
            </td>
        </tr>
    </table>
</div>

在dropzone.js中,我添加了如下代码:

previewTemplate: $('#previewTemplate').html()

因此,它正在获取“#previewTemplate”的内部 HTML。

我将所有表格放在一行中。

现在,我只想要连续的两个表。也就是说,在每一行中我想要两列。

我怎样才能做到这一点?

最佳答案

好吧,当我想在一个表中放置一个表时,我会在 td 标签内指定一个 td 标签或 th 标签,然后我将放入两个 div 标签作为两个表的容器并更改它们的 css 属性显示“inline-block”或“table-td”,然后我在其中插入表格,如下所示:

CSS

    .table_inner_1 {
    display: inline-block;
    }
    .table_inner_2 {
    margin-left: 10px;
    display: inline-block;
    }

/*this below is just to target both td's of both of the inner tables*/

    .table_inner_1 table tr td:not(:first-child), .table_inner_2 table  tr td:not(:first-child) 
    {
    padding-left: 5px;
    }

HTML

<table>
<tr>
<td>
<td>
<div class="table_inner_1"><table><tr><td>dummy text</td><td>dummy text</td></tr>
</table></div><div class="table_inner_2"><table><tr><td>dummy text</td><td>dummy text</td></tr></table></div>
</td>
</td>
</tr>
</table>

如果您需要的话,这可以将表格放入表格中。

关于javascript - 添加时在一行中的两列中显示两个表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32260586/

相关文章:

javascript - 如何在 JS 文件上使用不同版本的 JQuery?

初始状态未知的 jQuery toggle()

javascript - 如何使用 X-Frame-Options SAMEORIGIN 对来自同一域的页面进行 iframe?

javascript - 返回空洞的 promise

javascript - 在 React 中使用 onClick 处理程序维护 href "open in new tab"

javascript - 从 mvc dropdownlist 调用 javascript

javascript - 为什么 .setAttribute() 和 .removeAttribute 方法在我的 javascript 代码中不起作用?

javascript - 单击被图像覆盖的按钮

jquery - "Shift + Arrow key"的键码是什么?

jquery - 如何在具有相同类名的多个类中选择 1 个类?