Question

我有一个包含多个表的页面（每个“活动类型”一个表）。他们的ID是“活动类型”。每个表中的每一行都有一个带有下拉列表的单元格，允许用户选择他们想要将行移动到的新表的“活动类型”。

以下js代码确实将其原始表格中的一行移动到下拉菜单中所选的“活动类型”表格中。但是，移动行后，下拉列表中的选定值将保留为旧的“活动类型”。如何将下拉列表的值设置为该行现在所属的新“活动类型”？

$('.override-activity').change(function () {
    // get selected Activity Type
    var activityType = $("option:selected", this).text().replace(/\s+/g, '');

    // get selected row
    var tr = $(this).closest("tr").remove().clone();

    // insert selected row into new Activity Type table
    $("#" + activityType).find("table").append(tr);
});

Answer 1

这种情况正在发生，因为“更改”事件永远不会在选择中完成，因为您要从DOM中删除它。

你可以做2 thigs：

使用选择

在您附加TR之前，您可以设置您选择的值，如下所示：

$(document).on('change', '.override-activity', function () {
    // get selected Activity Type
    var activityType = $("option:selected", this).text().replace(/\s+/g, '');

    // Get the original selected value
    var selected = $(this).val();

    // get selected row
    var tr = $(this).closest("tr").remove().clone();

    // Reset the value
    $('.override-activity', tr).val(selected);

    // insert selected row into new Activity Type table
    $("#" + activityType).find("table").append(tr);
});

Answer 2

你可以在克隆tr之后和追加它之前做些什么。 tr.find('.override-activity').val(activityType)

jQuery根据下拉列表中的选择将行移动到另一个表

2 个答案: