首页 > 其他分享 >关于layui使用弹出层模版后对应上传组件不工作的问题记录

关于layui使用弹出层模版后对应上传组件不工作的问题记录

时间:2023-11-30 13:48:17浏览次数:45  
标签:layer layui 聊天室 content 弹出 模版 上传

image
这里页面的聊天室是使用的弹出层:

util.on('lay-on', {
                'open-chat-room': function () {
                    layer.open({
                        title: '项目聊天室',
                        type: 1,
                        offset: 'b',
                        anim: 'slideUp', // 从下往上
                        area: ['100%', '460px'],
                        shade: 0.1,
                        shadeClose: true,
                        id: 'ID-demo-layer-direction-b',
                        content: '<div class="col-md-7" style="float: left">' +
                            '<div class="panel panel-default"><div class="panel-heading">' +
                            '<i class="fa fa-tasks" aria-hidden="true"></i> Team Communicate (@选择提醒用户#选择task)</div><div><div id="chat-log" class="col-md-10" contenteditable="false" style="resize:none;height: 300px;background-color: floralwhite;align:top;overflow: auto;">' +
                            '</div>' +
                            '<div class="col-md-2" style="float: right">online用户: <div>' +
                            '<ul id="chatMembers"></ul></div></div></div>' +
                            '<div class="col-md-4" style="float: right;padding-top: 0%">' +
                            '<div id="atMembers" style="position: absolute" class="elementList" hidden="hidden">' +
                            '<ul id="atMembersUl" class="elementList2"></ul></div>' +
                            '<div id="atTasks" style="position: absolute" class="col-xs-4 elementListTask" hidden="hidden"><ul id="atTasksUl" class="elementList2Task"></ul></div>' +
                            '<input id="chat-message-input" oninput="msginputOnchange(event,this)" type="text" placeholder="聊天信息发送" onblur="closeInputChooseElements()"/><br/>' +
                            '<input id="chat-message-submit"  type="button" value="Send"/></div></div></div>' +

                            '<div class="col-md-4" style="float: right">' +
                            '<button type="button" class="layui-btn demo-class-accept" lay-options="{accept:"file"}">' +
                            '<i class="layui-icon layui-icon-upload"></i>上传文件</button></div>'

                    });
                    chatRoomSetup()
                },
                'test-offset-l': function () {
                    layer.open({
                        type: 1,
                        offset: 'l',
                        anim: 'slideRight', // 从左往右
                        area: ['320px', '100%'],
                        shade: 0.1,
                        shadeClose: true,
                        id: 'ID-demo-layer-direction-l',
                        content: '<div style="padding: 16px;">任意 HTML 内容</div>'
                    });
                }
            });

可以看到对应聊天室的代码在content之后,也就是弹出层里,但聊天室的功能正常,比如检测websocket,输入和@人,但是加入的上传模块却不起效(已经在外层html加入试过是可以的)。
对应layui官方文档中的这个上传还有一段js代码,我附在了上面代码之外最后,但是页面打开弹出层之后,点击上传文件没有反应,也没有任何报错等,

标签:layer,layui,聊天室,content,弹出,模版,上传
From: https://www.cnblogs.com/ukzq/p/17867086.html

相关文章

  • bat文件关闭打开的图片时弹出提示框
    @echooff&cd\&color0a&clsechosetwindowsdefaultpictureviewregadd"HKLM\SOFTWARE\Microsoft\WindowsPhotoViewer\Capabilities\FileAssociations"/v".jpg"/tREG_SZ/dPhotoViewer.FileAssoc.Tiff/fregadd&qu......
  • python 单击按钮弹出选择文件的窗口
    Python单击按钮弹出选择文件的窗口在编写Python程序时,有时我们需要让用户选择一个文件,例如读取文件内容进行处理,或者保存处理结果到指定的文件中。为了实现这个功能,我们可以使用tkinter库提供的文件选择对话框。tkinter库简介tkinter是Python的标准GUI库,可以用来创建各种图形用......
  • app直播源代码,弹出层 加遮罩层 页面禁止滑动
    app直播源代码,弹出层加遮罩层页面禁止滑动加遮罩层大标签下加标签 <div:class="[{introduced:AnimationsPopup}]"></div>scss.introduced{ width:100%; height:100%; position:fixed; top:0; left:0;  z-index:90; transition:all0.15slinea......
  • 通用的 logback.xml 日志模版
    通用的logback.xml日志模版 <?xmlversion="1.0"encoding="UTF-8"?><configuration> <!--定义日志输出目录--> <substitutionPropertyname="log.base"value="/log/joyupx/trade/"/> <!--<jmxConfig......
  • Java模版引擎注入(SSTI)漏洞研究
    一、FreeMarker模板注入安全风险0x1:FreeMarker简介FreeMarker是一款Java语言编写的模板引擎,它是一种基于模板和程序动态生成的数据,动态生成输出文本(HTML网页,电子邮件,配置文件,源代码等)的通用工具。它不是面向最终用户的,而是一个Java类库,是一款程序员可以嵌入他们所开发产品的组......
  • SSTI模版注入
    SSTI模版注入模板引擎模板引擎(这里特指用于Web开发的模板引擎)是为了使用户界面与业务数据(内容)分离而产生的,它可以生成特定格式的文档,利用模板引擎来生成前端的html代码,模板引擎会提供一套生成html代码的程序,然后只需要获取用户的数据,然后放到渲染函数里,然后生成模板+用户数据的......
  • 快排模版
    我打算复习下快排模版,结果怎么写都写不对,贼离谱,后来发现是自己犯了一个很弱智的错误,想取bas作为随机下边然后把a[bas]作为基准,但问题在于,我把c数组赋值给a数组这步省略成了把基准赋值给a[bas]了。。这固然是节约空间的好思路,但问题在于我此前错把一个可能被修改的量当成常量来用了......
  • 【golang】【注释模版】
    @目录写在前面注释要求package结构体方法代码逻辑注释参考资料基础/标准库/第三方库golang导航编程规范算法|面试项目写在前面相关博文个人博客首页免责声明:仅供学习交流使用!开源框架可能存在的风险和相关后果将完全由用户自行承担,本人不承担任何法律责任。注释要求统......
  • 快速排序与归并排序模版
    快速排序voidquick_sort(intq[],intl,intr){if(l>=r)return;inti=l-1,j=r+1,x=q[l+(r-l>>1)];while(i<j){doi++;while(q[i]<x);doj--;while(q[j]>x);if(i&l......
  • 高精度模版
    高精度加法vector<int>add(vector<int>&A,vector<int>&B){//654321654321vector<int>C;inttemp=0;for(inti=0;i<A.size()||i<B.size();++i){if(i<A.size())temp+=A[i];......