通过iframe hash 实现跨域

<h1>我是A页面</h1>
<iframe name="bpage" frameborder="0" scrolling="no" width="300" height="150" src="http://b.com/kuayu/b/b.html"></iframe>
<script type="text/javascript">
window.crossLoad = function() {
    window.location.reload();
};
window.setBackGroundColor = function(color) {
    if(color){document.body.style.backgroundColor = color};
};
</script>

 

 

测试页面
<div id="colordiv">
    <button action-type="setColor">red</button>
    <button action-type="setColor">green</button>
    <button action-type="setColor">yellow</button>
</div>

<iframe id="testframe" frameborder="0" scrolling="no" width="0" height="0" src="http://a.com/kuayu/a/delegate.html"></iframe>
<script src="http://127.0.0.1/STK/js/gaea_1_19.js"></script>
<script>

var node = STK.E("colordiv");
var testframe = STK.E("testframe");
var delegate = STK.delegatedEvent(node);
delegate.add("setColor" , 'click' , function(spec) {
    var color = spec.el.innerHTML;
    var obj = {
        funcName : "setBackGroundColor",
        args : [color]
    };
    testframe.src = testframe.src.replace(/#[^#]*$/ , "") + "#" + encodeURIComponent(STK.jsonToStr(obj));
});
</script>

 

<script>
window.location.hash = '';
var originHash;
function detectHash() {
    var nowHash = window.location.hash;
    if(nowHash && originHash != nowHash) {
        originHash = nowHash;
        var realHash = eval('(' + decodeURIComponent(nowHash.replace(/^#/ , '')) + ')');
        var funcName = realHash.funcName;
        var args = realHash.args;
        window.top[funcName].apply(window , args);
    }
};
setInterval(detectHash , 500);
</script>

你可能感兴趣的:(iframe)