jquery - 动态表可删除 TD

Question

我正在构建一个动态表。我希望表中的一列是可删除的。以下是我的代码。我的代码中的问题是整个 TR 变得可丢弃。请帮忙

$.each(obj, function (i, val) {
operation1 = $("<tr><td>" 
+ obj[i].Operation + "</td>" 
+ "<td>" + obj[i].OperationName 
+ "</td>" + "<td>" + "" + "</td>" + "<td>" + "" 
+ "</td><td><div class='droppable' id='op" + count 
+ "'></div></td></tr>");

$('#MainStepsTR').append(operation1);
operation1.droppable({
    activeClass: "ui-state-hover",
    hoverClass: "ui-state-active",
    drop: function (event, ui) {
        $(this)
        .addClass("ui-state-highlight")
        .find("p")
        .html("Dropped!");
     },
    accept: function (dropElem) {
        return ($(dropElem).hasClass("ui-state-default"));
    }
});
operation1 = "";
count += 1;
});

<table class="OperationsTbl">
    <tr class="Header">
        <th>Col1</th>
        <th>Col2</th>
        <th>Col3</th>
        <th>Col4</th>
        <th>Droppable Column</th>
    </tr>
    <tbody id="MainStepsTR"></tbody>
</table>

Answer 1

好的，答案是我必须将 droppable 事件绑定到类选择器

$(".droppableitem").droppable({