Question

我试图在没有页面刷新的情况下简单地使用POST方法

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN"> 

<P>Light Control: 
<FORM METHOD="POST" ACTION="http://192.168.100.106:8080/api/device/Light2"; enctype="application/json">
<P>Light On: <input type=hidden name=command value="on">
<UL></UL>
<P><INPUT TYPE=SUBMIT> </FORM>

Answer 1

按照我需要的方式工作...... AJAX JS低于HTML（感谢Simone）

HTML代码：

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN">
<head>
<script src="js/ajaxsbmt.js" type="text/javascript"></script>
</head>
<title>HALnix</title>
<H1>HALnix - Test</H1>
<P>Light Control:
<table>
<tr>
<td>
<FORM name="Light14on" METHOD="POST" ACTION="http://192.168.100.106:8080/api/device/Light14"; enctype="application/json" onsubmit="xmlhttpPost('http://192.168.100.106:8080/api/device/Light14', '$
Master Bedroom Lamp<input type=hidden name=command value="on">
</td>
<td><INPUT TYPE=SUBMIT value="On"> </FORM>
</td>
<td>
<FORM name="Light14off" METHOD="POST" ACTION="http://192.168.100.106:8080/api/device/Light14"; enctype="application/json" onsubmit="xmlhttpPost('http://192.168.100.106:8080/api/device/Light14', $
<input type=hidden name=command value="off">
<INPUT TYPE=SUBMIT value="Off"> </FORM>
</td>
</tr>
</table>

AJAX JS代码（ajaxsbmt.js）

//##################################################################################
//## FORM SUBMIT WITH AJAX                                                        ##
//## @Author: Simone Rodriguez aka Pukos <http://www.SimoneRodriguez.com>         ##
//## @Version: 1.2                                                                ##
//## @Released: 28/08/2007                                                        ##
//## @License: GNU/GPL v. 2 <http://www.gnu.org/copyleft/gpl.html>                ##
//##################################################################################


function xmlhttpPost(strURL,formname,responsediv,responsemsg) {
    var xmlHttpReq = false;
    var self = this;
    // Xhr per Mozilla/Safari/Ie7
    if (window.XMLHttpRequest) {
        self.xmlHttpReq = new XMLHttpRequest();
    }
    // per tutte le altre versioni di IE
    else if (window.ActiveXObject) {
        self.xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
    }
    self.xmlHttpReq.open('POST', strURL, true);
    self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    self.xmlHttpReq.onreadystatechange = function() {
        if (self.xmlHttpReq.readyState == 4) {
            // Quando pronta, visualizzo la risposta del form
            updatepage(self.xmlHttpReq.responseText,responsediv);
        }
        else{
            // In attesa della risposta del form visualizzo il msg di attesa
            updatepage(responsemsg,responsediv);

        }
    }
    self.xmlHttpReq.send(getquerystring(formname));
}

function getquerystring(formname) {
    var form = document.forms[formname];
    var qstr = "";

    function GetElemValue(name, value) {
        qstr += (qstr.length > 0 ? "&" : "")
            + escape(name).replace(/\+/g, "%2B") + "="
            + escape(value ? value : "").replace(/\+/g, "%2B");
            //+ escape(value ? value : "").replace(/\n/g, "%0D");
    }

    var elemArray = form.elements;
    for (var i = 0; i < elemArray.length; i++) {
        var element = elemArray[i];
        var elemType = element.type.toUpperCase();
        var elemName = element.name;
        if (elemName) {
            if (elemType == "TEXT"
                    || elemType == "TEXTAREA"
                    || elemType == "PASSWORD"
                    || elemType == "BUTTON"
                    || elemType == "RESET"
                    || elemType == "SUBMIT"
                    || elemType == "FILE"
                    || elemType == "IMAGE"
                    || elemType == "HIDDEN")
                GetElemValue(elemName, element.value);
            else if (elemType == "CHECKBOX" && element.checked)
                GetElemValue(elemName, 
                    element.value ? element.value : "On");
            else if (elemType == "RADIO" && element.checked)
                GetElemValue(elemName, element.value);
            else if (elemType.indexOf("SELECT") != -1)
                for (var j = 0; j < element.options.length; j++) {
                    var option = element.options[j];
                    if (option.selected)
                        GetElemValue(elemName,
                            option.value ? option.value : option.text);
                }
        }
    }
    return qstr;
}
function updatepage(str,responsediv){
    document.getElementById(responsediv).innerHTML = str;
}

使用POST方法通过刷新将信息发送到URL

1 个答案: