javascript - 为什么更改文本区域会阻止使用 AJAX 将内容加载到其中？

Question

我正在为我网站上留下的评论创建一个报价系统。如果用户想回复别人所说的话，他或她可以单击评论上的“引用”按钮，这将运行一个脚本，将引用的评论(和一些格式)添加到唯一的 <textarea> 中。在页面上。该脚本还将考虑 <textarea> 中的任何先前内容。 ，在此其他内容之后添加引用的评论。

问题是如果我点击 <textarea> , 给它焦点，或者在我添加更多引用评论时尝试调整它的大小，即使我的“测试”警报运行，内容也不会加载；我必须刷新页面才能重置它。如果我避免更改它，我可以整天单击引用按钮，并适本地向 <textarea> 添加无限数量的评论。 .我是 Javascript 的新手，所以我不确定是什么导致了这个问题。

function quoteComment()
{
    $(".quote").on("click", function(event){

        event.preventDefault();

        var quoteID = this.id.match(/\d+/);
        var textContent = $("#textarea").val();

        $("#textarea").load("/php/_quote.comment.php", {

            id: quoteID,
            content: textContent

        }, function(){

           //$("#textarea").focus(); <-- this... 
           //resize code <-- or this (either alone or together) will break the functionality
           alert("test");
        });
    });
}

Answer 1

您不能使用 load()在 <textarea> 上.当您需要设置 value 时，它会尝试在内部设置 innerHTML相反。

尝试使用 $.post相反，并在回调中设置值

$.post("/php/_quote.comment.php", {
  id: quoteID,
  content: textContent
}, function(data) {
  $("#textarea").val(data).focus();
  alert("test");
}).fail(function(){ alert('failed for some reason, inspect in dev tools network');})