Microanswer

Microanswer

320飞吻 2019-11-2 加入 来自成都市

(https://www.microanswer.cn)

Microanswer 最近的回答

  • 5天前layui可否在主流的cdn上收录一下中回答:

    @layui不官方 使用jsdelivr去加载GitHub上的资源,并不会因为GitHub慢使得jsdelivr就慢,实际上jsdelivr无论加载npm上的还是GitHub上的资源都很快。

    不妨 点击链接 试一试。
  • 5天前layui可否在主流的cdn上收录一下中回答:

    jsdelivr 支持自动使用Github上的内容。那么这意味着你可以像这样使用layui:
    使用css: 
    <link rel="stylesheet" href="//cdn.jsdelivr.net/gh/sentsin/layui@2.5.6/dist/css/layui.css">

    使用js:
    <script src="//cdn.jsdelivr.net/gh/sentsin/layui@2.5.6/dist/layui.js"></script>
    但是有时候的业务需求在使用原本的layui代码无法满足时,就需要将其down到本地修改源码再使用,这种情况就不需再使用cdn的方法了。
  • 6天前基于 layui 的下拉菜单控件 dropdown文档中回答:

    @sven7 鼠标 右击下载 然后选择"(链接)另存为",即可保存到本地,方便使用代码编辑器查看。
  • 6天前基于 layui 的下拉菜单控件 dropdown文档中回答:

    @sven7
    dropdown自身并不能把你在toolbar模板里面动态生成的按钮转移到下拉框的内容里面来。

    但我相信你动态生成按钮是因为每条数据具备了不同的操作功能按钮,所以才动态生成对应的操作按钮。

    dropdown不能把这些按钮转移到下拉框里,但这并不意味着它不能实现对应的功能,通过适当的代码结构,可以避免动态去生成不同的dom,取而代之的是动态的配置下拉按钮的菜单。这是一份案列效果图:

    右侧的下拉菜单总是会根据用户不同的状态提供不同的下拉功能


    这里 点击下载 是这张效果图的实现源码,希望能够对你有所帮助。

    最后,虽然dropdown自身并不能把你动态生成的dom转移到下拉框内,但你可以通过手动实现:
    1、使用自定义下拉内容。
    2、为option传入success回调方法,在此方法中通过代码将你生成的dom转移到下拉框里。
    这个方法在难度上和可维护性上都不存在优势,所以并不推荐。
  • 2020-5-15 17:6:15基于 layui 的下拉菜单控件 dropdown文档中回答:

    @lzblqq 你已经得到了真传![哈哈] 。我这边进行了一些注释和优化,你下载下来,对比你的和我修改后的观看观看。

    点击立即下载,解压压缩包,里面有你贴的代码和修改后的代码。对比观看效果更佳!
  • 2020-5-15 14:32:48基于 layui 的下拉菜单控件 dropdown文档中回答:

    @lzblqq 可通过添加一个字段(设为opened)来标记状态。
    if ($(this).data("opened") === "true") {
    dropdown.hide("下拉框按钮选择器");
    $(this).data("openen", "false");
    } else {
    ... 之前的实现代码 ...
    $(this).data("openen", "true");
    }
  • 2020-5-15 13:17:28基于 layui 的下拉菜单控件 dropdown文档中回答:

    @lzblqq 事件这一块的话是必须使用委托进行,这是无容置疑的,那么可以对范围进行缩小。既然你是在表格里使用这些下拉,你可以缩小选择器范围:

    // 从整个文档里寻找点击了id为mydropdown的按钮。
    $(document.body).on("click", "#mydropdown", function () {

    // 可以优化为:
    $("[lay-id='你的table的id']").on("click", "你的下拉按钮的选择器", function () {
  • 2020-5-15 11:5:55基于 layui 的下拉菜单控件 dropdown文档中回答:

    @lzblqq 根据你的需求,展开列表时再将menus扩展,那么用户看到的则始终时扩展之后的内容。所以我实现为这样的功能:
    每次打开下拉框时,都进行初始化,使下拉内容动态按情况显示。

    实现方法:

    由于每次点击都显示不同内容,这就必须通过suite方法进行初始化了。方法如下:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>test</title>
    <link rel="stylesheet" href="jslib/layui/css/layui.css">
    </head>
    <body>
    <div style="margin: 100px">
    <button class="layui-btn layui-btn-sm" id="mydropdown">下拉</button>
    </div>

    <script src="jslib/layui/layui.js"></script>
    <script>
    layui.config({
    base: "./js/"
    }).use(["dropdown","jquery"], function () {
    var dropdown = layui.dropdown;
    var $ = layui.jquery;
    var MENUS_C = [
    [{txt: "菜单一"}, {txt: "菜单二"}, {txt: "菜单三"}],
    [{txt: "开通会员"}, {txt: "关停账号"}, {txt: "退出登录"}],
    [{txt: "1"}, {txt: "2"}, {txt: "3"}],
    [{txt: "sfx"}, {txt: "sefx"}, {txt: "drtc"}],
    [{txt: "sfvergc"}, {txt: "rtgcd"}, {txt: "vdsgfe"}],
    [{txt: "eeee"}, {txt: "rctcrt"}, {txt: "55555"}],
    [{txt: "sdfer"}, {txt: "aaaa"}, {txt: "ccccc"}],
    [{txt: "tttt"}, {txt: "vvvvv"}, {txt: "wwwww"}],
    ]

    // 点击下拉按钮,每次都进行初始化。以达到显示不同内容。
    // 【尤为重要】因为下拉框内部使用on方法监听了点击事件,所以这里不能再使用on
    // 这会和组件内冲突,故此这里使用事件委托来监听。
    $(document.body).on("click", "#mydropdown", function () {

    // 随机丛备选菜单选择一个用于下拉。以达到动态显示菜单内容。
    var menus = MENUS_C[Math.floor(Math.random()*MENUS_C.length)];

    // 拿到上次的初始化实例,以便显示新的下拉框后将上次的清理掉。
    var oldDropdownInstance = $(this).data("dropdown");
    if (oldDropdownInstance) {
    oldDropdownInstance.$dom.off("click"); // 进一步防止触发以前的下拉初始化。
    oldDropdownInstance.$down.remove(); // 移除以前的下拉内容。
    }
    $(this).data("dropdown", null); // 将下拉实例清空,使下面的初始化能正常进行。

    dropdown.suite("#mydropdown", {
    menus: menus,
    immed: true // 开启初始化完成后立即显示。
    });
    });
    });
    </script>
    </body>
    </html>

    效果:

  • 2020-5-14 12:39:0基于 layui 的下拉菜单控件 dropdown文档中回答:

    @lzblqq [心] 感谢你的支持!
  • 2020-5-12 14:46:29闲心确实消失好久了中回答:



    魔性
  • 2020-5-11 11:50:40下拉框搜索中回答:

    控件可能是这样想的:你输入的在备选列表里有了,认为你是选了一个,就不给你显示出来了。
  • 2020-5-11 10:25:51日期选择框的示例是怎么做到页面一滚动就自己关闭的,我的是悬浮在页面上中回答:

    $(window).on("scroll", function () {
    $(document.body)[0].click();
    });
  • 2020-5-10 23:27:18基于 layui 的下拉菜单控件 dropdown文档中回答:

    @卖刀的小女孩 v2.2.0 新版本发布啦。

    新增了:
    1. 参数 immed 默认为 false, 指定为true则在初始化成功后立即显示。
    2. 参数 arrow 默认为 true,指定为false则不会显示下拉框上面的小箭头。
    优化了:
    1. 提升了滚动性能,界面滚动时下拉框跟随触发按钮更丝滑。
    2. 优化了失焦隐藏逻辑。

    感谢兄dai一直以来的支持,这次更新作为我个人来说也是比较满意的。
  • 2020-5-9 9:18:0关于表格内css样式中回答:

    这个时候就不得不自荐一波了。[嘻嘻]
  • 2020-5-9 9:11:15layui打开文件夹很慢,响应很慢。每次打来浏览器会卡住几分钟。再跳出来文件夹中回答:

    虽然很正确,但是还是被戳中笑点。

    您好,这个问题应该不是layui的问题,您换个电脑或环境再试试呢
  • 2020-5-8 19:23:28基于 layui 的下拉菜单控件 dropdown文档中回答:

    @卖刀的小女孩 描述这么详细,有心了有心了。

    添加 暴露这个show 方法功能的时候,就是拿着下拉框实例调用show方法。这样简单实现了。

    后来我想,既然暴露了show,那hide也不能少嘛,我就又加了个hide。而由于下拉框被设计成点击以外的地方就自动关闭,如果hide方法是外界通过点击一个按钮调用它,那还没等hide调用,下拉框就因为失去焦点关闭了,就心想,那还要这个hide搞毛啊。

    于是我就加了个force字段,凡是通过show方法打开的,就标记为下拉框不要在失去焦点的时候关闭。

    等我做好了,我又想,可这玩意儿不能通过点击外部关闭的话,感觉好像有毛病啊。我又转念一想,既然外界都有直接调用show方法的需求了,那么可能这是比较重要的显示,不让其点击外部隐藏也说得过去。

    结果你这边就来了一个需求,在点击的时候才初始化,顺带显示。看来有必要把决定是否force交给用户。

    最后感谢指出问题,我将尽快做出升级。
  • 2020-5-8 10:27:6从bootstarp迁移过来,结果步步都是坑啊中回答:

    realod 方法里面重新render了一下表格,使dom结构变成了全新的了。使用jquery绑定的事件会随之被干掉。没得法,确实,这样绑定事件的话就肯定会有这个问题。

    一开始我也是这样的,后来我发现,我通过done回调又重新绑定事件(先不考虑性能),还是“勉强能冲”。但是随着我要实现更多的功能后,我发现这样一些问题:

    1. 我要修改表格某行数据(并不直接通过表格编辑,通过弹出新dialog编辑),修改后我发现,我要怎么把修改后的数据体现到界面呢,总不能又去 reload 吧。
    2. 我要删除一条数据,又怎么体现到界面上呢。

    面临这些问题,我又去看文档,我发现,table本身提供了一套监听事件的机制,而且在事件回调的同时还会带入当前行数据相关操作方法,可以方便的完成行更新、删除这些操作。而且事件不会因为reload丢失。

    我一开始使用jquery来绑定事件,也是在没有进一步阅读table的文档就直接开始“淦”导致的,后来发现table提供了相关方法,说明设计上还是考虑得有点东西。

    这些基本功能肯定还是没有问题,而更进一步的高级功能,显然是没有专业table组件来得生猛,毕竟layui除了这个table,还有许多其它的要维护嘛。
  • 2020-5-7 14:54:38基于 layui 的下拉菜单控件 dropdown文档中回答:

    @快乐浪子哥 自动加载css功能加入啦。v2.1.0,文档里的下载连接就是了。
  • 2020-5-7 9:59:40你们在Layui社区搜索东西,默认的搜索引擎是www2.bing.com吗?中回答:

    难道不是 Ctrl + F 吗
  • 2020-5-6 16:17:51table 选项中的 url 如何修改域路径?中回答:

    这也许是一个解决办法:
    layui.define(['table'], function(exports){

    // 设定希望的url前缀地址。
    var baseurl = 'xxxxxx';

    exports('myTable', {
    // 外部使用 myTable 的时候若还希望使用table的一些方法可通过这个快速调用,而不用再引入一遍table。
    table: layui.table,

    // 暴露自己的render,加入 baseurl 的判断功能。
    render: function(param){
    if (param.url){
    param.url = baseurl + param.url;
    }
    return layui.table.render(param);
    }
    });
    });
    然后其它地方使用就使用 myTable。 这有点像Java里的继承。 这里 MyTable 继承了 table。 姑且这样理解吧。
  • 2020-5-6 15:50:26基于 layui 的下拉菜单控件 dropdown文档中回答:

    @成凯 有啥问题?
  • 2020-5-4 19:32:27exports导出问题中回答:

    试试:

    <script>
    layui.config({
    base: 'js/modules/'
    }).use('demo', function(){
    var demo = layui.demo;
    demo();
    });
    </script>
  • 2020-4-28 11:17:42基于 layui 的下拉菜单控件 dropdown文档中回答:

    @george_cheng 出现的具体问题是表格滚动后下拉框跑偏了吗?
  • 2020-4-26 8:52:7.render中怎么获取异步数据中的数据中回答:

    parseData 数据格式解析的回调函数,用于将返回的任意数据格式解析成 table 组件规定的数据格式。

    able 组件默认规定的数据格式为:
    {
    "code": 0,
    "msg": "",
    "count": 1000,
    "data": [{}, {}]
    }
    很多时候,您接口返回的数据格式并不一定都符合 table 默认规定的格式,比如:
    {
    "status": 0,
    "message": "",
    "total": 180,
    "data": {
    "item": [{}, {}]
    }
    }
    那么你需要借助 parseData 回调函数将其解析成 table 组件所规定的数据格式:
    table.render({
    elem: '#demp'
    ,url: ''
    ,parseData: function(res){ //res 即为原始返回的数据
    return {
    "code": res.status, //解析接口状态
    "msg": res.message, //解析提示文本
    "count": res.total, //解析数据长度
    "data": res.data.item //解析数据列表
    };
    }
    //,…… //其他参数
    });
  • 2020-4-23 23:36:18基于 layui 的下拉菜单控件 dropdown文档中回答:

    @finary [泪] 手机打字总是出错,那个 监听行工具事件 链接写错了,这里补上:

    监听行工具事件
  • 2020-4-23 23:32:41基于 layui 的下拉菜单控件 dropdown文档中回答:

    @finary (补发)如果在表格右侧单元格里使用,那么可以不需要使用 dropdown.onFilter 来监听点击事件,因为这样会失去数据表格本身提供的(update,del等)方法对表格进行一些额外的数据操作。

    一旦你为每一个menu条目设置了event,你可以按数据表格文档里说的里的 :监听行工具事件 的方式来监听这些菜单条目的点击事件,这样还可以具备表格提供的相关方法。
  • 2020-4-23 23:28:53基于 layui 的下拉菜单控件 dropdown文档中回答:

    @finary 如果在表格右侧单元格里使用,那么可以不需要使用 dropdown.onFilter 来监听点击事件,因为这样会失去数据表格本身提供的(update,del等)方法对表格进行一些额外的数据操作。

    一旦你为每一个menu条目设置了event,你可以按数据表格文档里说的里的 : https://www.layui.com/doc/modules/table.html#onool
  • 2020-4-22 23:27:7求助大佬看看问题中回答:

    你的Layui 版本号是?
  • 2020-4-20 23:21:41 layer.open 后的下拉列表框中回答:

    把弹出框宽高设大一点点
  • 2020-4-20 22:18:17layui数据表格单元格右边对应的下拉按钮(内容超出后显示全部内容)中回答:

    @吴斌417 我这边咋又好好的?

    代码:


    效果:


    即使把所有列都设置为 百分比 的,都是可以的。