You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
layui/examples/base.html

129 lines
3.4 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>基础方法测试用例 - layui</title>
<link href="../src/css/layui.css" rel="stylesheet">
</head>
<body>
<div class="layui-container" style="padding: 30px 0;">
<div class="" style="padding: 30px 0;">
<blockquote class="layui-elem-quote" style="color: #666;">
点击按钮开始测试,测试结果打开浏览器控制台查看
</blockquote>
<div class="layui-btn-container">
<button class="layui-btn" lay-on="sort">layui.sort</button>
<button class="layui-btn" lay-on="type">layui.type</button>
<button class="layui-btn" lay-on="isArray">layui.isArray</button>
<button class="layui-btn" lay-on="extend">lay.extend</button>
</div>
</div>
</div>
<script src="../src/layui.js"></script>
<script>
layui.use(['lay', 'util'], function(){
var lay = layui.lay
,util = layui.util;
//事件
var style = 'color: orange; font-size: 16px;';
util.event('lay-on', {
sort: function(){
//sort
console.log('%c> layui.sort: ', style);
console.log(
'数字-整数型',
layui.sort([{a: 3},{a: 0},{a: 0},{a: -1},{a: -5},{a: 6},{a: 9},{a: -333333}], 'a')
);
console.log(
'数字-浮点型',
layui.sort([{a: 3.5},{a: 0.5},{a: 0.5},{a: -1.5},{a: -5.5},{a: 6.5},{a: 9.5},{a: -333333.5}], 'a')
);
console.log(
'数字-混合型',
layui.sort([{a: 1},{a: 20.5},{a: 20.3},{a: 3},{a: 52},{a: 4.3}], 'a')
);
console.log(
'中文',
layui.sort([{a: '男'},{a: '女'},{a: '男'},{a: '女'},{a: '男'}], 'a')
);
console.log(
'英文',
layui.sort([{a: 'E'},{a: 'B'},{a: 'D'},{a: 'C'},{a: 'A'}], 'a')
);
console.log(
'混合'
,layui.sort([
{a: 3}
,{a: '男'}
,{a: 0}
,{a: 66}
,{a: 99}
,{a: 'C'}
,{a: '女'}
,{a: 3.5}
,{a: 0}
,{a: -1}
,{a: 'B'}
,{a: 5.5}
,{a: '男'}
,{a: 'A'}
,{a: -5}
,{a: '男'}
,{a: 6}
,{a: 9}
], 'a')
);
console.log(
'数组成员全为数字',
layui.sort([1, 20.5, 19.5, 52, 4.5])
);
console.log(
'数组成员为混合型',
layui.sort([1, {a: 32}, 20.5, {a: 6}, 52, 5.5], 'a') //按成员对象的 key 为 a 进行比较
);
}
,type: function(){
console.log('%c> layui.type: ', style);
console.log(
'new RegExp()', layui.type(new RegExp()),
'\nnew Date()', layui.type(new Date()),
'\n[]', layui.type([])
);
}
,isArray: function(){
console.log('%c> layui.isArray: ', style);
console.log(
'[1,6]', layui.isArray([1,6]),
'\nlay("div")', layui.isArray(lay('div')),
'\ndocument.querySelectorAll("div")', layui.isArray(document.querySelectorAll('div')),
'\n{"key": "value"}', layui.isArray({key: 'value'})
);
}
,extend: function(){
console.log('%c> lay.extend: ', style);
console.log(
lay.extend(
{},
{a: 123, c: {ccc: 'ccc'}, arr: [1,3]},
{a: 111, b: 1, c: {bbb: 'bbb'}},
{a: 222222, arr: [5]}
)
);
console.log(
lay.extend([], [1,3,5])
);
}
})
});
</script>
</body>
</html>