javascript - 重新打开 JAM 对话框

Question

嗨，新年快乐，

有一个 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 主题和位置。

谁能看出代码哪里出了问题吗？

提前致谢真挚地，巴巴克

Answer 1

andleer是正确的，不要将toggle()与jQM一起使用，这是不需要的。 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/