每次我将可拖动对象拖放到表格上时，表格都会改变行的高度
每次我将可拖动对象拖放到表格上时，表格都会改变行的高度
提问于 2018-06-21 04:05:08
所以，我对桌子有个问题。它有3个tds，它们是行中的单元格，其中3个是jquery中的droppables，我的问题是每次我将一个draggable放到它们上面时，单元格的高度就会改变，它会改变表的整体高度。我尝试了css属性表-布局:修复，但它不工作plz，如果你可以帮助它将是很棒的…我现在正在使用jquery，javascript，css，html和bootstrap，提前谢谢
表格
<div class="row">
<div class="col-12 tabla">
<table class="table table-bordered">
<thead>
<tr>
<th scope="col">Deportivas</th>
<th scope="col">Culturales</th>
<th scope="col">Otras</th>
</tr>
</thead>
<tbody>
<tr>
<td>Ir a atletismo</td>
<td class="td1"></td>
<td>Ir al cumpleaños</td>
</tr>
<tr>
<td class="td2"></td>
<td>Ir al museo</td>
<td class="td3"></td>
</tr>
<tr>
<td class="raya"><span class="raya-tb">—</span></td>
<td class="raya"><span class="raya-tb">—</span></td>
<td class="libro">Leer un libro</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>表的css
.tabla{
margin-top: 15%;
}
table
{
width: 100%;
height: 100%;
table-layout: fixed !important;
}
td
{
padding: 0;
}和javascript + jquery脚本
$("#draggable, #draggable2, #draggable3").draggable(
{
cursor: "move",
helper: 'clone',
revert: "invalid"
}
);
$(".td3").droppable(
{
tolerance: "intersect",
accept: "#draggable",
drop: function(event, ui) {
$(".td3").append($(ui.draggable));
}
});回答 2
Stack Overflow用户
发布于 2018-06-21 04:32:41
尝试将这些样式添加到css
td.ui-droppable {
position: relative;
}
td.ui-droppable .ui-draggable {
position: absolute;
left: 0;
top: 0;
}Stack Overflow用户
发布于 2018-06-26 05:48:46
所以我最终放弃了，尝试着把p拖放到表格的td (单元格)中，然后我用一些不透明度为0的文本包装了一个div，然后当p拖入滴管时，拖放到div上，因为div上已经有文本了，所以不会改变td的大小。我从中学到了两件事，带有可拖动对象的表做了意想不到的事情，第二，总是将项目包装在div上。谢谢
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50956234
复制相关文章
相似问题