Heim > Web-Frontend > js-Tutorial > Hauptteil

Detaillierte Erläuterung der Beispiele für Eltern-Kind-Seiten in Layer.js

韦小宝
Freigeben: 2018-03-12 10:03:06
Original
1826 Leute haben es durchsucht

In diesem Artikel werden hauptsächlich Beispiele für die Vater-Kind-Seite in Layer.js vorgestellt. Ich hoffe, dass dieser Artikel jedem helfen kann, die Vater-Kind-Seite in Layer besser zu verstehen. js.

Layer ist eine webelastische Layer-Komponente, die in den letzten Jahren populär geworden ist. Die offizielle Website-Adresse lautet: http://layer.layui.com/

Sie Sie können es von der offiziellen Website herunterladen. Laden Sie die neueste Version herunter.

Wenn die Ebene ein neues Fenster (Unterseite) als iframe Ebene öffnet, erfahren Sie, wie Sie auf die Elemente und Funktionen der übergeordneten Seite auf der Unterseite zugreifen.

1. Greifen Sie auf den übergeordneten Seitenelementwert zu

    var parentId=parent.$("#id").val();//访问父页面元素值
Nach dem Login kopieren

2. Greifen Sie auf die übergeordnete Seitenmethode zu

    var parentMethodValue=parent.getMethodValue();//访问父页面方法
Nach dem Login kopieren

3. So schließen Sie das Popup-Unterseitenfenster

    var index = parent.layer.getFrameIndex(window.name); //获取窗口索引  
    parent.layer.close(index);//关闭弹出的子页面窗口
Nach dem Login kopieren

4. So aktualisieren Sie die übergeordnete Seite von der Unterseite aus

    parent.location.reload(); // 父页面刷新
Nach dem Login kopieren

layer.js öffnet mehrere <code><span style="font-size: 18px;">iframe</span>iframeSo finden Sie die übergeordnete Seitenmethode

Übergeordnete Seite –

function aa() {
    var index = parent.layer.getFrameIndex(window.name);
    var iframeName = &#39;layui-layer-iframe&#39; + index;
    openDialog1(&#39;选择XXX&#39;, &#39;${ctx}/*****,&#39;800px &#39;, &#39;500px &#39;,iframeName);      
    }  &#39;
Nach dem Login kopieren
function openDialog1(title, url, width, height, target) {
    top.layer.open({
        type: 2,
        area: [width, height],
        title: title,
        maxmin: true,
        //开启最大化最小化按钮  
        content: url,
        btn: [&#39;确定&#39;, &#39;关闭&#39;],
        yes: function(index, layero) {
            var body = top.layer.getChildFrame(&#39;body&#39;, index);
            var iframeWin = layero.find(&#39;iframe&#39;)[0]; //得到iframe页的窗口对象,执行iframe页的方法:iframeWin.method();  
            var inputForm = body.find(&#39;#inputForm&#39;);
            var top_iframe;
            if (target) {
                top_iframe = target; //如果指定了iframe,则在改frame中跳转  
            } else {
                top_iframe = top.getActiveTab().attr("name"); //获取当前active的tab的iframe   
            }
            inputForm.attr("target", top_iframe); //表单提交成功后,从服务器返回的url在当前tab中展示  
            if (iframeWin.contentWindow.doSubmit(top_iframe)) {
                top.layer.close(index); //关闭对话框。  

                top.window[iframeName].frames.location.reload(); //刷新父亲  
            }

        },
        cancel: function(index) {}
    });

}
Nach dem Login kopieren
    //子页面回调方法     
    function addRecord(name,chainName)
    {  
        alert(name);  
    }
Nach dem Login kopieren

Unterseite
function doSubmit(iframeName) {
    var sel = $("tbody tr td input.i-checks:checked");    var size = sel.size();    if (size == 0) {
        top.layer.alert(&#39;请至少选择一条数据!&#39;, {
            icon: 0,
            title: &#39;警告&#39;
        });        return false;
    } else {        for (var i = 0; i < size; i++) {
            top.window[iframeName].addRecord(sel[i].name, sel[i].value);
        }        return true;
    }
}
Nach dem Login kopieren

Das Obige ist der Inhalt dieses Artikels Wenn Sie mit der Ebene nicht vertraut sind, können Sie einen Blick darauf werfen!

Verwandte Empfehlungen:

Erklärung zum Zuweisen von Werten von der Unterebene zur übergeordneten Ebene Seitenelemente

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Beispiele für Eltern-Kind-Seiten in Layer.js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!