Micro Loushu Project Summary (a) front-end

• IFRAME

Dynamically generated IFRAME

        // 新建IFRAME并设置模板链接
        var newIframeObject = document.createElement("IFRAME");
        newIframeObject.src = "panorama.html";
        // 设置显示宽高
        newIframeObject.width = "500px";
        newIframeObject.height = "500px";
        // 将IFRAME插入指定html
        $('.hxzs_imgshow').empty().append(newIframeObject);
        // IFRAME加载完成后执行
        newIframeObject.onload = function () {
            newIframeObject.contentWindow.update("view//img//houseType1//panorama1.PNG");
        }

IFRAME parent child interaction

Parent-child interaction Reference article

Examples

Child <script> tags embedded Method

        function update(string) {
            xxxxxxxxxxxxxxxxxxxxx
        }

IFRAME parent calls the method (full load execution confirmation IFRAME onload Methods Method)

        // 新建IFRAME并设置模板链接
        var newIframeObject = document.createElement("IFRAME");
        newIframeObject.src = "panorama.html";
        // 设置显示宽高
        newIframeObject.width = "500px";
        newIframeObject.height = "500px";
        // 将IFRAME插入指定html
        $('.hxzs_imgshow').empty().append(newIframeObject);

        // IFRAME加载完成后执行
        newIframeObject.onload = function () {
            // 执行IFRAME内方法
            newIframeObject.contentWindow.update("view//img//houseType1//panorama1.PNG");
        }

• arttemplate

Document official website

Examples

Here a reserved <div id = "content"> as a template in html generated container is placed, and then reserve a <script id = "test"> as a template.

First rendering template with template ( 'test', data) to find the statement template 'test', and filled into the template data DATA 'test', id then acquired container A container according to the generated template can be placed into a container.

arttemplate iterative array can not be directly, if the padding data is an array of fade data = [x, x, x, x], you need to be converted to an array of objects to be iterative, such as {data}, the following templates Example the list can be directly changed data can be iterated.