检查是否在 contenteditable div 中删除了元素（文本）

Question

我正在使用 jQuery 来检测 @ 符号是否已插入到 contenteditable div 中。当检测到这种情况时，将向服务器触发 ajax 请求以检索用户列表。然后，用户将单击用户名（函数 adduser 将触发），它将在 div 中创建一个禁用的文本区域。 然后我动态创建一个输入，将用户的 id 选为值（通知他们）

我遇到的问题是，如果我从 contenteditable div 中删除了一个 textarea（用户名），我怎么知道它是哪个 textarea，所以也删除了以用户 ID 作为值的输入？

我的脚本：

function adduser(fname, lname, id, q)
    {
        var fname = fname;
        var lname = lname;
        var id = id;
        var word = '@' + q;
        var iid = 'id' + id;
    
      var old=$("#contentbox").html();
        var content=old.replace(word,""); 
        
    $("#contentbox").html(content);
        
    var E="<textarea class='textareamention' name="+id+" id="+iid+"  disabled >"+fname+"</textarea>";
                
    $("#contentbox").append(E);
                
      $('<input/>').attr({ type: 'text', name: 'mention[]', id: id, value: id}).appendTo('#post');
    }

我的 contenteditable div id 是 contentbox。

Answer 1

要删除元素，您可以使用remove() 方法或仅使用hide() 元素。

例如：

$("#input_id").remove();

或者

$("#input_id").hide();

从您的代码中可以看出，您正在动态生成 TextArea。所以同时，你可以创建一个如下所示的事件。

如果你想检测一个特定元素是否被移除，你必须先设置事件。

$("#myTextArea").on("remove", function () {
    console.log("Element was removed");
})

更新：

这是一个有效的FIDDLE。

注意：您还必须在代码中包含 Jquery UI 和 Jquery，才能使用 remove() 事件。

希望这会有所帮助。