Heim > Web-Frontend > Layui-Tutorial > Laui definiert ein Modul und verwendet eine Instanz

Laui definiert ein Modul und verwendet eine Instanz

Freigeben: 2019-11-29 14:14:45
nach vorne
2811 Leute haben es durchsucht

Laui definiert ein Modul und verwendet eine Instanz

Bei der Verwendung von Laui gibt es mehrere Methoden, auf die von mehreren Js verwiesen werden muss. Daher habe ich ein Laui-Modul entsprechend dem Dokument angepasst und der Implementierungsprozess ist wie folgt (empfohlen: Layui-Verwendungsanleitung)

Definieren Sie zuerst ein Modul

//定义模块
layui.define(['form'], function(exports){

    var form = layui.form; //只有执行了这一步,部分表单元素才会自动修饰成功
    var $ = layui.$;

    var obj = {
        changeParentPlace: function (parentId,tagId,levelPlace) {
            $.ajax({
                url:ctx + '/base/place/changeParentPlace',
                type:'get',
                data:{
                    parentId:parentId
                },
                dataType:'json',
                success:function (data) {
                    $("#" + tagId).empty();
                    $("#" + tagId).append(&#39;<option value="">请选择</option>&#39;);
                    if(data.result != null && data.result.length != 0) {
                        $.each(data.result,function(i,place) {
                            if(levelPlace == place.name) {
                                $("#" + tagId).append(&#39;<option selected value="&#39;+place.id+&#39;">&#39;+place.name+&#39;</option>&#39;)
                            }else {
                                $("#" + tagId).append(&#39;<option value="&#39;+place.id+&#39;">&#39;+place.name+&#39;</option>&#39;)
                            }
                        })
                    }
                    form.render(&#39;select&#39;); //刷新select选择框渲染
                }
            })
        }
    }

    //输出模块
    exports(&#39;common&#39;, obj);
});
Nach dem Login kopieren

Definieren Sie die Methode mitlayui.define

Der erste Parameter in define kann geladen werden Einige integrierte Teile von Laui Um das Modul zu verwenden, werden einige öffentliche Methoden in der zweiten Rückrufmethode definiert.

Der erste Parameter von exports ist der Name dieses Moduls und der zweite Parameter ist ein Objekt, in dem diese enthalten sind Es sind drei Methoden definiert.

Modul festlegen

//设置模块
layui.config({
    base: ctx + &#39;/js/app/modules/&#39; //假设这是你存放拓展模块的根目录
}).extend({ //设定模块别名
    common:&#39;common&#39;
});
Nach dem Login kopieren

Modul mitlayui.config definieren

base definiert das Verzeichnis, in dem sich die js befinden, die das Modul definieren

common ist der Alias ​​der Einstellung, „common“ ist der Dateiname im Verzeichnis (.js wird automatisch hinzugefügt)

Modul aufrufen

layui.use([&#39;common&#39;], function(){
    var common = layui.common;

    common.changeParentPlace($("#firstLevelId").val(),&#39;secondLevelId&#39;);

});
Nach dem Login kopieren

Verwenden Sie zuerst das Common-Modul und Der Aufrufcode lautet wie oben: common.changeParentPlace($("#firstLevelId") .val(),'secondLevelId'); ist derselbe wie bei der Verwendung integrierter Module

Das obige ist der detaillierte Inhalt vonLaui definiert ein Modul und verwendet eine Instanz. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:csdn.net
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