问当同时使用时，如何调用jquery对话框？
EN

Stack Overflow用户

提问于 2015-09-03 17:33:12

回答 1查看 1K关注 0票数 0

我试图在网页上使用jEasyUI和jQueryUI。我想使用这里找到的易雨色带插件http://www.jeasyui.com/extension/ribbon.php以及标准的jQuery对话框。似乎jquery库用自己的版本覆盖了标准的jquery $.dialog方法。是否可以同时使用jquery和jquery，并从这两个库中选择您想要的对象？

我试过简单地首先调用easyui库，然后调用jquery库，但这似乎没有什么区别。

编辑以添加示例代码

所需的结果是，我想要添加一个按钮到对话框工具栏，我需要句柄打开和关闭事件的对话框。注释掉easyui的标题可以恢复到使用jqueryui，但是我当然不能使用我想要访问的额外的easyui内容。

<html>
    <head>
        <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
        <meta content="utf-8" http-equiv="encoding">


        <script src="vendor/js/jquery-1.10.2.js"></script>

        <script src="vendor/js/jquery-ui-1.10.4.custom.js"></script>

        <!-- jquery-easyui stuff -->

        <link rel="stylesheet" type="text/css" href="vendor/jquery-easyui-1.4.3/themes/default/easyui.css">
        <link rel="stylesheet" type="text/css" href="vendor/jquery-easyui-1.4.3/themes/icon.css">
        <link rel="stylesheet" type="text/css" href="vendor/jquery-easyui-1.4.3/demo/demo.css">
        <script type="text/javascript" src="vendor/jquery-easyui-1.4.3/jquery.easyui.min.js"></script>

        <!-- jquery-easyui stuff -->

        <link href="vendor/jquery-ui-1.11.4.custom/jquery-ui.min.css" rel="stylesheet">

    </head>

    <body>


        <div id="DialogDrawer" style="display:none;">
            <div id="PrintingHolderDiv">
                <div>
                    <label>Paper Size:</label>
                    <select id="PrintPageSize" onchange="PrintPaperSizeSelected()">
                        <option value=""></option>
                        <option value="A4">8.5" x 11" </option>
                        <option value="A3" selected>11" x 17" </option>
                        <option value="Plotter18">18" plotter </option>
                        <option value="Plotter24">24" plotter </option>
                        <option value="Plotter36">36" plotter </option>
                        <option value="Custom">Custom </option>
                    </select>
                </div>
                <div id="PrintPaperWidthDiv" class="block">
                    <label>Paper Width</label>
                    <input id="PrintPageWidth" type="number" value="17" oninput="PrintPageSizeUpdated();"></input>
                </div>
                <div id="PrintPaperHeightDiv" class="block">
                    <label>Paper Height</label>
                    <input id="PrintPageHeight" type="number" value="11" oninput="PrintPageSizeUpdated();"></input>
                </div>
            </div>
        </div>


        <script>
            function PopupDialog(divID, dialogTitle, dialogWidth, dialogHeight){
                // This function makes a dialog for the specified the specified dialog out of the ribbon

                // Open the dialog and run the callback function
                var q = $('#' + divID + 'HolderDiv').dialog({
                    // modal:true,
                    title: dialogTitle,
                    width: dialogWidth,
                    height: dialogHeight,
                      open: function(event, ui){

                        //// THIS EVENT ISN'T HIT WITH EasyUI dialog

                        //// THIS CODE WORKS WITH THE jquery-ui dialog

                        // Add the pop-out icon next to the close button in the dialog toolbar
                        $(".ui-dialog-titlebar").append("<img id='" + divID + "_NewWindowPopupImg' class='ui-icon ui-icon-help' src='Images/PopOut.png' style='padding-right: 40px; cursor:pointer;' title='Open sidebar in new window'>");



                        $('#' + divID + '_NewWindowPopupImg').click(
                            // Closure for this window
                            function(){ 
                                // do stuff...
                            }
                        );

                      },
                      close: function(event, ui) {

                        //// THIS EVENT ISN'T HIT WITH EasyUI dialog

                        $(this).dialog('destroy');
                      }
                });



            }

            window.onload = function(){
                PopupDialog('Printing', 'Print', 300, 400);
            }
        </script>

    </body>

</html>

javascript

jquery-ui

jquery-easyui

回答 1

Stack Overflow用户

发布于 2017-01-05 11:16:26

似乎不可能解决这个问题。您只需使用提供的对话框，如果已经使用，则必须避免使用jquery。这是另一个人创造的小提琴：e http://jsfiddle.net/vmDP8/11/

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/32382060

复制

相似问题

问当同时使用时，如何调用jquery对话框？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问当同时使用时，如何调用jquery对话框？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问当同时使用时，如何调用jquery对话框？
EN