将jQuery Dialog与jQuery Mobile一起使用

Question

我一直在使用jQuery构建动态对话框以获取用户输入。 在html页面中未定义对话框的html内容的意义上的动态。

例如：

    showPasswordDialogConfirmUser: function (callback) {
        $('<div></div>').dialog({
            modal: true,
            title: "Enter Password to connect to Dynamix !",
            open: function () {
                var markup = '<input type="password" id="dynamixUserPassword"/>';
                $(this).html(markup);
            },
            buttons: {
                'Forgot ?': function () {
                    $(this).dialog("close");
                    Dynamix.binding = false;
                    Dynamix.bound = false;
                    PairingUtils.clearAllCookies();
                    Dynamix.bind();
                },
                'Connect': function () {
                    callback($('#dynamixUserPassword').val());
                    $(this).dialog("close");
                }
            }
        });
    }

我一直在尝试在jQuery Mobile中做这类事情，但我找不到任何有用的东西。 jQM需要在页面中预定义弹出窗口的html内容，但我无法访问html页面。我也尝试过一起使用jQuery UI和jQM，但它弄乱了很多ui的东西。

有任何变通方法吗？

JS小提琴示例：https://jsfiddle.net/tgL1n4je/3/

对话框没有显示在一起使用jQuery UI和jQuery Mobile。