Einführung in verschiedene Referenzmethoden der Laui-Modularisierung und Nicht-Modularisierung-Layui-Tutorial-php.cn

Einführung in verschiedene Referenzmethoden der Laui-Modularisierung und Nicht-Modularisierung

尚

Freigeben： 2019-12-19 17:03:41

nach vorne

2022 Leute haben es durchsucht

Einführung in verschiedene Referenzmethoden der Laui-Modularisierung und Nicht-Modularisierung

Die verschiedenen Referenzmethoden von Laui modular und nicht modular:

1. Der Unterschied zwischen modular und nicht modular

Es gibt viele verschiedene integrierte Module in Laui, wie z. B. Popup-Ebene, Datums- und Zeitauswahl, Paging und andere verschiedene Module.

Modularisierung: Laden Sie das entsprechende Modul, wenn Sie es verwenden.

Nicht modular: Alle Module auf einmal laden.

2. Modulare Referenz

Referenz ../layui/layui.js

① Schreiben Sie normalerweise eine Tool-Klasselayui.util.js (Erweiterbar ), direkte Referenz

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

Nach dem Login kopieren

② JSP-Seite

<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/layui/layui.all.js"></script>
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/layui/layui_util.js"></script>

<script type="text/javascript">
	
  	$(function(){
		　　laydate.render({
		    　　　　elem: &#39;#test&#39; //指定元素
		 　　});
  	});
  	
	function openLayui() {
		　　layer.msg(&#39;hello&#39;);
		　　　　layer.open({
			　　　　type : 1,
			　　　　maxmin : true,
			　　　　area: [&#39;500px&#39;, &#39;300px&#39;],
			　　　　content : $(&#39;#inputId&#39;),
			　　　　btn: [&#39;确定&#39;, &#39;重置&#39;, &#39;关闭&#39;], //可以无限个按钮,
			　　　　btn1: function(index, layero){
				　　　　　　alert(parent.$("#inputId").val());
				　　　　　　//layer.close(parent.layer.getFrameIndex(window.name));
				　　　　　　layer.close(index);
			　　　　},
			　　　　btn2: function(index, layero){
				　　　　　　layer.style(index, {
				  　　　　　　　　width: &#39;80px&#39;
				　　　　　　});
				　　　　　　parent.$("#inputId").val("button");
				　　　　　　return false;
			　　　　},
			　　　　btn3: function(index, layero){
				　　　　　　alert(index);
				　　　　　　return false; 	
			　　　　}
		　　　});
		　　var index = layer.getFrameIndex(window.name);
		　　layer.title(&#39;傻逼&#39;, index);
		
	}
</script>
</head>
<body>
	　　<input type="button" onclick="openLayui()" id="inputId" value="弹框" />
	　　<input type="text" id="test"/>
</body>
</html>

Nach dem Login kopieren

3. Nicht-modulare Referenz

Referenz .. /layui/layui.all.js

Normalerweise schreiben Sie eine Werkzeugklasse namens „layui.util.js“ (erweiterbar) und verweisen direkt auf Layer, „Laydate“...

var layer = layui.layer;
var laydate = layui.laydate;

Nach dem Login kopieren

oder direkt auf der JSP-Seite. Sie können „layui.layer“ und „layui“ verwenden .laydate auf JSP-Seiten

Weitere Informationen zu Laui finden Sie in der Spalte Tutorial zur Verwendung von Laui auf der chinesischen PHP-Website.

Das obige ist der detaillierte Inhalt vonEinführung in verschiedene Referenzmethoden der Laui-Modularisierung und Nicht-Modularisierung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!