Maison > interface Web > Tutoriel Layui > layui définit un module et utilise l'instance

layui définit un module et utilise l'instance

Libérer: 2019-11-29 14:14:45
avant
2810 Les gens l'ont consulté

layui définit un module et utilise l'instance

Dans le processus d'utilisation de layui, il existe plusieurs méthodes qui doivent être référencées par plusieurs js, j'ai donc personnalisé un module layui en fonction du document, et le processus d'implémentation est le suivant (recommandé : tutoriel d'utilisation de layui)

Définissez d'abord un module

//定义模块
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);
});
Copier après la connexion

Définissez la méthode à l'aide de layui.define

Le premier paramètre de définition peut charger certaines parties intégrées de layui Pour utiliser le module, certaines méthodes publiques sont définies dans la deuxième méthode de rappel

Le premier paramètre des exports est le nom de ce module, et le deuxième paramètre est un objet dans lequel ces trois méthodes sont définies.

Définir le module

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

Définir le module en utilisant layui.config

base définit le répertoire où se trouve le js qui définit le module

common est l'alias du paramètre,'common' est le nom du fichier dans le répertoire (.js est automatiquement ajouté)

Module d'appel

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

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

});
Copier après la connexion

Utilisez d'abord le module commun, et le code appelant est comme ci-dessus common.changeParentPlace($("#firstLevelId") .val(),'secondLevelId'); est identique à l'utilisation de modules intégrés

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:csdn.net
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal