0

嗨,新年快乐,

有这个 JQM 对话框,它通过 AJAX 调用像这样打开

$('#calendar-event-form-container').html(HTML).toggle();
$("#calendar-event-form-container").dialog({theme:'a'});

并关闭

$("#calendar-event-form-container").dialog('close');
$("#calendar-event-form-container").toggle();

下次打开对话框时,它会丢失其 JQM 主题和位置。

任何人都可以看到代码出错的地方吗?

提前致谢 巴巴克

4

2 回答 2

1

将表单显示和隐藏为对话框toggle()是非标准的。jQuery Mobile 对话框旨在显示或隐藏页面<div data-role="page">容器。因此,假定它位于当前页面之外,并且在显示为对话框之前不可见。

http://jquerymobile.com/demos/1.2.0/docs/pages/dialog/index.html

data-rel="dialog"“通过将属性添加到页面锚链接,任何页面都可以呈现为模式对话框”

于 2013-01-02T15:43:27.097 回答
1

andleer 是正确的,不要在 jQM 中使用 toggle(),它不是必需的。创建 jQM 对话框以用作单独的页面。看看这个例子:

<div data-role="page" id="index">
    <div data-theme="a" data-role="header">
        <h3>
            First Page
        </h3>
        <a href="#second" class="ui-btn-right">Next</a>
    </div>

    <div data-role="content">
        <a href="#" data-role="button" id="open-button">Open dialo</a>         
    </div>

    <div data-theme="a" data-role="footer" data-position="fixed">

    </div>
</div>
<!-- DIALOG BOX -->
<div data-role="page" id="dialog-box" data-theme="b">
    <div data-role="header">
        <h1>Warning</h1>
    </div>
    <div data-role="content">
        <h3 id="dialog-msg">
            Dialog test
        </h3>
        <a href="#" data-role="button" id="close-button">
            Close dialog
        </a>   
    </div>
</div>  

如果可能的话,你应该打开这样的对话框:

$.mobile.changePage('#dialog-box', {transition: 'pop', role: 'dialog'});

如果您正在动态更改对话框内容,则必须在其上触发 pagecreate 以正确重新设置样式:

$('#dialog-box').trigger("pagecreate");

这是一个完整的 jsFiddle 示例:http: //jsfiddle.net/Gajotres/fXzWj/

于 2013-01-02T17:08:43.537 回答