Question

我在页面中使用以下JavaScript代码。问题是代码首次执行并从元素中获取数据。

在后续调用期间，表单元素中已更改的数据对此函数不可用，因为它使用来自其首次调用的数据。

$(document).ready(function() {
$('<textarea id="message-clone"></textarea>').insertAfter("#form-message-compose");
var saveDraft = function () {
    var originalStriped = $("#wysiwyg").val().replace(/(<([^>]+)>)/ig,"");
    if((originalStriped.length) > 10) {
        var input = $("<input>").attr("type", "hidden").attr("id", "savedraft")
                    .attr("name", "submit").val("savedraft");
        $.ajax({ 
            type: "POST",                                            
            url: $("#form-message-compose").attr("action"),
            data: $("#form-message-compose").append(input).serialize(),
            success: function(result){
                var result = JSON.parse(result);
                $("#subject").val(result.message_subject);
                $('input[name="draft"]').val(1);
                $("#id").val(result.message_id);
                var flash = '<div id="flash" class="alert alert-success"><a data-dismiss="alert" class="close">×</a><strong>Yay!</strong> Message Auto saved to drafts!</div>';
                $("#page-title").append(flash);
                $("#flash").fadeOut(3000, function() { $(this).remove(); });                            
                $("#savedraft").remove();
                $("#message-clone").val($("#wysiwyg").val().replace(/(<([^>]+)>)/ig,""));
            }
       });
    }
}
setInterval(saveDraft(), 2000);
});

这里的问题是，第一次，函数从输入元素#wysiwyg中获取正确的数据，但在后续期间，它不会更新来自调用$('#wysiwyg').val()的数据，这会导致单次执行if块内的代码。

请指导，我做错了。

Answer 1

setInterval(saveDraft(), 2000);

应该是

setInterval(saveDraft, 2000);

setInterval的第一个参数应该是一个函数。你没有传递函数，你正在做的是执行saveDraft并将结果作为参数传递。

Answer 2

问题在于我使用的Tiny MCE。因此，而不是试图通过

获取texte区域的值

var originalStriped = $("#wysiwyg").val().replace(/(<([^>]+)>)/ig,"");

我不得不使用tinyMCE方法来获取文本

var originalStriped = tinyMCE.get("wysiwyg").getContent({format : "text"});

TinyMCE的另一个问题是它不会在AJAX调用上更新textarea中的数据，否则，它会在表单提交时更新。所以我不得不通过调用

手动调用触发器来保存tinyMCE

tinyMCE.triggerSave();

然后使用表单数据触发AJAX请求。

setInterval（）在多次调用期间不更新数据

2 个答案: