synthax highlighter - 在 textarea 元素中编辑突出显示的文本

Question

我已经实现了 Alex Gorbatchev 的 Synthax 荧光笔，它工作得很好，但是当用户双击突出显示的文本（此时它变成了 textarea 的一个 div）时，它进入了编辑模式（使用其中突出显示的文本数据）。我创建了一个按钮，并执行单击事件，试图从中获取新输入/编辑的文本以通过 ajax 重新发布，但我不断收到 textarea 中的旧文本（变成高亮的 div）或“未定义” .我正在使用 jQuery 来获取新输入的文本，但没有运气。非常感谢任何帮助！

extends layout
block content
  h2=d.title
    a(class='button', href='/documents/' + d._id + '/edit') Edit
  p
    a(href='/documents', class='button')
      ← All Documents
  script(type="text/javascript")
    SyntaxHighlighter.all();
    SyntaxHighlighter.config.tagName = "textarea";

  form(name="form1") 
    div(style="width:800px; margin:0 auto; border: 2px grey solid;")  
      textarea(class="brush: js;", style="width:800px;", readonly="true", id = "srcText", disabled)
        =d.data || ''

  button(id="submit", class='button')

  script
    $("#submit").click(function (e) {
      console.log("boom");
      var dId = '#{d._id}';
      var dData = $("textarea").val(); // << -- problem here cant obtain the value
      console.log("DATA  is: ", dData);
      var updateDocumentIdPath = "/documents/" + dId + "/update";
      $.ajax({
        url: updateDocumentIdPath, 
        type: "POST",  
        data: {"data": dData},
        success: function (data) {
          console.log("success");
          console.log(data);
        },
        error: function () {
          console.log("error");
        },
        complete: function () {
        }
      }); // END ajax
    }); 

Answer 1

为了获取数据，您使用的是$("textarea").val();，它返回document 中的第一个 textarea 的值。文档：http://api.jquery.com/val/

您需要的是：$("textarea:last").val();。这将返回document 中最后一个textarea 的值。假设它将是document 中的最后一个textarea，因为您提到它是在切换到编辑模式之前动态插入的。