通过XMLHttpRequest进行内容不敏感自动保存

时间:2011-07-12 15:07:35

标签: javascript html xmlhttprequest

我正在尝试进行自动保存,可以将其放入我的任何表单中并对内容进行“自我感知”以模拟实际保存。另外,我希望它能够在自动保存多次失败的情况下通知用户。以下是我提出的问题,但由于我的XMLHttpRequest.send(),我一直在准备readyState = 4和status = 500。当我“正常”单击使用表单保存时,保存工作完全正常,但此代码似乎似乎没有正确传递数据。每个具有此代码的页面都有一个setTimeout(autosave,5000)来初始化代码。有人能指出我正在做错的方向吗?我是XMLHttpRequest对象的新手。

据我所知,last_params使用正确的数据“发送”,但是当我通过request()(另一端使用经典ASP)获取它时,值为“”(空白)。我想我有一个执行问题的命令,我只是不知道什么或在哪里。

快速脚注:我知道jQuery和其他框架有'相似'的功能,但我对它们感觉还不够舒服。我想从“简单”开始。

var last_params = "";
var autosave_time = 61000;

var autosave_fail_check = 5;
var max_autosave_fail_check = 5;

var response_text = "";

function autosave() {

    var autosave_button_name = "save_button";

    var form_action = document.getElementById("formS").action;
    var form_data = document.getElementById("formS");
    var all_inputs = form_data.getElementsByTagName("input");
    var all_textareas = form_data.getElementsByTagName("textarea");

    var params = "";

    // Check all inputs for data        
    for (var i = 0; i < all_inputs.length; i++) {
        var current_item = all_inputs[i];
        if (current_item.type != "button" && current_item.type != "submit") {
            if (current_item.type != "checkbox") {
                params += current_item.name + "=" + current_item.value + "&";

            } else {
                params += current_item.name + "=" + current_item.checked + "&";
            }
        }       
    }

    // check all textareas for data
    for (var i = 0; i < all_textareas.length; i++) {
        var current_item = all_textareas[i];
        params += current_item.name + "=" + current_item.value + "&";
    }

    params += "autosave=1";

    if (params == last_params) {
        setTimeout(autosave, autosave_time);
        return;
    } else {
        last_params = params;
    }

    // Setup time
    var time = "";
    var currentTime = new Date();
    var hours = currentTime.getHours();
    var minutes = currentTime.getMinutes();
    var seconds = currentTime.getSeconds();

    if (minutes < 10) {
        minutes = "0" + minutes;
    }

    time = hours + ":" + minutes + ":" + seconds;

    if(hours > 11){
        time = time + "PM";
    } else {
        time = time + "AM";
    }

    var status = "[]";

    // **************************************************
    var http;

    try {
      // Gecko-based browsers, Safari, and Opera.
      http = new XMLHttpRequest();
    } catch(e) {
        try {
          // For Internet Explorer.
          http = new ActiveXObject('Msxml2.XMLHTTP');
        } catch (e) {
            // Browser supports Javascript but not XMLHttpRequest.
            document.getElementById(autosave_button_name).value = "Autosave NOT Available";
            http = false;
        }
    }

    http.onreadystatechange = function()
    {
        if (http.readyState == 4 && http.status == 200) {
            autosave_fail_check = max_autosave_fail_check; // reset the fail check
        }
        status = " [" + http.readyState + " / " + http.status + "] ";
    }

    if (autosave_fail_check <= 0) {
        if (autosave_fail_check == 0) {
            document.getElementById(autosave_button_name).value = "Autosave FAILURE; Check Connection!";
            //alert("Autosave has FAILED! Please check your connection!");
        } 

        autosave_fail_check = -1;
    } else {
        autosave_fail_check--;  
    }

    var url = form_action;

    http.open("POST", url, true); // async set to false to prevent moving on without saving
    http.setRequestHeader("Content-type", "multipart/form-data");
    http.setRequestHeader("Content-length", params.length);
    http.setRequestHeader("Connection", "close");
    http.send(last_params);

    response_text = http.responseText;

    if (autosave_fail_check >= 0) {
        document.getElementById(autosave_button_name).value = "Last Saved: " + time + " [" + autosave_fail_check + "] " + status;
    } else {
        autosave_fail_check = -1;   
    }

    setTimeout(autosave, autosave_time);

} // end function autosave()

0 个答案:

没有答案