Question

现在我正在做的是我在url中附加了一些参数并将该url发布到服务器上，这会将某些内容还原。到目前为止工作正常。网址是

var uri = "test.html?isJSON=true";

AIM.download(uri,{'onStart' : function(){return true;}, 'onComplete' : function(response){
    if(response==undefined || response=="")
        return;
    setMessage("generateMessage",response,"error");
    }});



 AIM = { 
frame : function(c,u) {

    var n = 'f' + Math.floor(Math.random() * 99999);
    var token = "";
    if(u==undefined || u=="")
        u="about:blank";
    if(JSLI.TOKEN_VALUE && JSLI.TOKEN_VALUE !=""){
        if(u && u.indexOf('?') != -1) {
            u = u + '&' +JSLI.TOKEN_NAME+"="+JSLI.TOKEN_VALUE;
        } else {
            u = u + '?' +JSLI.TOKEN_NAME+"="+JSLI.TOKEN_VALUE;
        }
    }

    var d = document.createElement('DIV');
    d.innerHTML = '<iframe style="display:none" src="'+ u +'" id="'+n+'" name="'+n+'" onload="AIM.loaded(\''+n+'\')"></iframe>';
    document.body.appendChild(d);

    var i = document.getElementById(n);
    if (c && typeof(c.onComplete) == 'function') {
        i.onComplete = c.onComplete;
    }

    return n;
},

form : function(f, name) {
    f.setAttribute("action", attachToken(f.action));
    f.setAttribute('target', name);
},

submit : function(f, c) {
    AIM.form(f, AIM.frame(c));
    if (c && typeof(c.onStart) == 'function') {
        return c.onStart();
    } else {
        return true;
    }
},

loaded : function(id) {
    var i = document.getElementById(id);
    if (i.contentDocument) {
        var d = i.contentDocument;
    } else if (i.contentWindow) {
        var d = i.contentWindow.document;
    } else {
        var d = window.frames[id].document;
    }
    if (d.location.href == "about:blank"
        && i.src == "about:blank") {
        return;
    }
    if(d.location.href.indexOf("login.html?expired=true")!=-1){
        document.location.href = "login.html?expired=true";
        return;
    }
    if (typeof(i.onComplete) == 'function') {
        i.onComplete(d.body.innerHTML);
    }
},
download:function(u,c)
{
    AIM.frame(c,u);
    if (c && typeof(c.onStart) == 'function') {
        return c.onStart();
    } else {
        return true;
    }
}

};

直到这里代码工作正常。现在我想发送一个文本数据，我不能通过在uri中添加来发送。所以我创建了一个表单但是无法解决如何使用此方法发送此表单值。

<form id="frmKey" name="frmKey">       

<input type="hidden" name="txt" id="txt"/>


</form>

Answer 1

将postMessage视为将数据从一个窗口/帧发送到另一个窗口/帧的解决方案：

在你的main.html中：

<form>
<p><label for="message">Message</label>
<input type="text" name="msg" value="text to send" id="msg" /> 
<input type="submit" />
</p>
<iframe id="iframe" src="http://your.server/iframe.html"></iframe>
</form>

<script>
  var frame = document.getElementById('iframe').contentWindow;
  document.querySelector('form').addEventListener('submit', (e) => {
    frame.postMessage(document.getElementById('msg').value, 'http://your.server');
    e.preventDefault();
  }, false);
</script>

在你的iframe.html中：

<div id="msg"></div>
<script>
function receive( ev ){
  document.getElementById('msg').innerHTML = ev.data;
}
window.addEventListener("message", receive, false);
</script>

该示例是http://html5demos.com/postmessage2

的精简版本

Answer 2

使用target的{{1}}属性，您可以指定以下内容：

_ blank - 新页面框架 - 在iframe中显示给定名称

_self - 显示在表单所在的同一iframe中

_parent - 显示在表单的iframe
的父页面/ iframe中
_top - 最顶层的窗口

Credits - DavidLin

form

SO上的片段是沙盒，所以你看不到它的工作原理。检查http://output.jsbin.com/yemebaladi以查看请求的流程。

如何在iframe请求中发布参数

2 个答案: