开发者社区> 问答> 正文

EasyUi1.4.0(JQuery版本1.11.0),dialog(对话框)组件在火狐浏览器下显示不全的问题

描述:
所有文件css、js包括jquery都是在官网下载的,不存在版本冲突,另外又下载了最新的1.4.4,发现又有这个问题,而在IE8+和谷歌下都是没有问题的,所以也不可能是bug,那最有可能的应该是火狐浏览器多做了什么工作了,下面上图:
screenshot
screenshot
利用firebug查看(最终html元素):
screenshot
问题是发现了,这个样式应该是初始化时动态生成的,原谅我真的不是专业前端开发,该怎么改呢,在哪里改呢,jquery or easyui?有没有遇到相同问题的同事,给个建议。头都大了,

展开
收起
杨冬芳 2016-06-08 10:22:52 2310 0
1 条回答
写回答
取消 提交回答
  • IT从业
    $('#dialog').dialog({
      ...
      left:...
      top:...
      ...
    });


    在对话框显示后,调用center方法看看

    $('#dialog').dialog(“center”);

    官网给你例子在firefox下ok没问题的

    按你的页面结构,测试了下,在firefox没有出现问题~~
    把你的CSS及精简后的页面代码贴出来看看吧~~

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Title</title>
        <link rel="stylesheet" type="text/css" href="script/easyui_1_4_4/themes/default/easyui.css">
        <!--jquery 1.11.3 jquery 2.1.3也是同样-->
        <script type="text/javascript" src="script/easyui_1_4_4/jquery.min.js"></script>
        <script type="text/javascript" src="script/easyui_1_4_4/jquery.easyui.min.js"></script>
        <script>
            $(function(){
                $('#openDialog').on("click",function(){
                    //JS动态创建
                    $('body').append('<div id="messageDialog"></div>');
                    $('#messageDialog').dialog({
                        width:500,
                        height:500,
                        modal:true,
                        closed: false,
                        cache: false,
                        content:'TEST~~~'
                    });
    
                    //$('#dd').dialog("open");
    
                });
            });
    
        </script>
    </head>
    <body class="easyui-layout">
        <div data-options="region:'north',title:'North Title',split:true" style="height:100px;">
            <button id="openDialog">openDialog</button>
        </div>
        <div data-options="region:'south',title:'South Title',split:true" style="height:100px;"></div>
        <div data-options="region:'east',title:'East',split:true" style="width:100px;"></div>
        <div data-options="region:'west',title:'West',split:true" style="width:100px;"></div>
        <div data-options="region:'center',title:'center title'" style="padding:5px;background:#eee;"></div>
        <!--声明式创建-->
        <div id="dd" class="easyui-dialog" title="My Dialog" style="width:486px;height:400px;"
             data-options="iconCls:'icon-save',closed:true,modal:true">
            Dialog Content.
        </div>
    
    </body>
    
    </html>
    2019-07-17 19:31:17
    赞同 展开评论 打赏
问答排行榜
最热
最新

相关课程

更多

相关电子书

更多
WEB浏览器中即将发生的安全变化 立即下载
基于浏览器的实时构建探索之路 立即下载
基于浏览器的实时构建探索之路--玄寂 立即下载