0

我在 jQuery Mobile 中有一个基本的回调弹出对话框：

<a id='callback' href='#call_back' data-rel='popup' data-position-to='window' aria-owns='pre-rendered' aria-haspopup='true' aria-expanded='false' data-history='false'><div>CALLBACK<br><span>Provide us your phone number<br>and we will call you back!</span></div></a>
<!-- a lot of other stuff comes here... -->
<!-- back to popup dialog -->
<div id='call_back-screen' class='ui-popup-screen ui-screen-hidden'></div>
<div id='call_back-popup' class='ui-popup-container flip ui-popup-hidden ui-body-inherit ui-overlay-shadow ui-corner-all'>
    <div id='call_back' data-fn='call_back' class='fn_data ui-content ui-popup ui-body-a ui-overlay-shadow ui-corner-all' data-role='popup' data-enhanced='true' data-theme='a' data-transition='flip'>
        <div data-role='header' role='banner' class='ui-header ui-bar-inherit'>
            <div>Welcome!</div>
            <a href='#' data-history='false' data-rel='back' class='ui-btn-right ui-btn ui-btn-a ui-icon-delete ui-btn-icon-notext ui-shadow ui-corner-all' data-role='button' role='button'>Close</a>
        </div>
        <div role='main' class='ui-content'>
            <div class='row nob msg'>
                <div class='ui-field-contain'>If you provide us your phone number and your email address, we are going to call you back in 2 days and help.</div>
            </div>
            <!-- input fields come here -->
        </div>
    </div>
</div>

我的问题是当我在第一页时，我打开回调弹出窗口，然后我尝试通过关闭按钮关闭它（不要在对话框外部单击，因为效果很好）整个页面关闭并且浏览器回到它的起始页。显然 data-rel='back' 被触发，它告诉浏览器返回 1 页，因为没有前一页，这意味着它将返回到起始页。

但这不是根据 jQuery Mobile API 文档的预期行为： https ://demos.jquerymobile.com/1.1.2/docs/pages/page-links.html

...而且我还有一个 data-history='false' 似乎没有任何效果的属性。

我尝试使用 data-direction='reverse' 而不是 data-rel='back' 重写代码，将 onclick 事件添加到关闭按钮：

<a href='#' data-history='false' data-direction='reverse' class='ui-btn-right ui-btn ui-btn-a ui-icon-delete ui-btn-icon-notext ui-shadow ui-corner-all' data-role='button' role='button' onclick='history.go(0);'>Close</a>

它使页面重新加载而不是完全关闭，当我在第一页时会好一点，但是当我转到第二页时，当我对弹出对话框执行相同操作时，它也会重新加载，但事实并非如此很好，因为代码的第一个版本在第二页上运行良好。

你能告诉我我应该改变什么以使弹出对话框在网站的第一页上正常工作吗？

4

1 回答 1

0

在href中解决onclick="$("#call_back").popup("close");"，所以：

<a href='#' data-history='false' data-direction='reverse' class='ui-btn-right ui-btn ui-btn-a ui-icon-delete ui-btn-icon-notext ui-shadow ui-corner-all' data-role='button' role='button' onclick='$("#call_back").popup("close");'>Close</a>

作品。

于 2021-04-15T10:25:59.527 回答