我发现了一个没有人回答的与我的确切问题有关的问题:
https://stackoverflow.com/questions/11218707/jquery-mobile-data-rel-dialog-not-firing
我有一个对话框,当用户按下按钮时应该打开。它适用于所有桌面浏览器和 Android 浏览器。它不适用于 iPhone 或 iPad 上的 Safari。如果您在 iDevice 上刷新页面,它可以工作。
这是我的按钮:
<a href="#popup" data-role="button" data-rel="dialog" data-icon="gear" data-iconpos="right" data-transition="slidedown">@Model.selectedDate.ToShortDateString()</a>
这是我的对话框:
<div data-role="dialog" id="popup">
<div data-role="header" data-theme="b">
<h1>Production Date</h1>
</div>
<div data-role="content" data-theme="b">
@using (Html.BeginForm()) {
<div data-role="fieldcontainer">
@Html.LabelFor(model => model.selectedSystem, "Select a date for System " + Model.selectedSystem)
@Html.HiddenFor(model => model.selectedSystem)
@Html.LabelFor(model => model.selectedDate, "Date:")
@Html.TextBoxFor(model => model.selectedDate, new { type = "date" })
</div>
<button type="submit" data-theme="b">Select</button>
}
</div>
这是渲染页面的页面源:
<div data-role="page" id="mainpage" data-theme="b">
<div data-role="header" data-theme="b" data-position="fixed">
<center>
<a href="/Home/Main">
<img src="/mobileDemo/Images/company_header_logo_mobile.png" border="0" /></a>
</center>
</div>
<div style="text-align: center; padding-top: 5px">
<center>
<a href="/mobileDemo/Home/Main">
<img src="/mobileDemo/Images/menu_home.png" style="width: 40px" border="0" /></a>
<a href="/mobileDemo/Counts">
<img src="/mobileDemo/Images/menu_prodcounts.png" style="width: 40px" border="0" /></a>
<a href="/mobileDemo/Inventory">
<img src="/mobileDemo/Images/menu_inventory.png" style="width: 40px" border="0" /></a>
<a href="/mobileDemo/Vehicle">
<img src="/mobileDemo/Images/menu_vehicle.png" style="width: 40px" border="0" /></a>
<a href="/mobileDemo/SSAR">
<img src="/mobileDemo/Images/menu_ssar.png" style="width: 40px" border="0" /></a>
<a href="/mobileDemo/STAR">
<img src="/mobileDemo/Images/menu_star.png" style="width: 40px" border="0" /></a>
<a href="/mobileDemo/EXECDASH">
<img src="/mobileDemo/Images/menu_dashboard.png" style="width: 40px" border="0" /></a>
</center>
</div>
<div style="padding-left: 20px; padding-top: 10px">
<strong>Body Dashboard for System 1</strong>
</div>
<div style="padding-right: 15px; padding-left: 15px; padding-top: 10px">
<a href="#popup" data-role="button" data-rel="dialog" data-icon="gear" data-iconpos="right"
data-transition="pop">11/7/2012</a>
<hr />
<ul data-role="listview" data-inset="true">
<li><a href="/mobileDemo/ExecDash/BodyProd/1/11-07-2012">Production</a></li>
<li><a href="/mobileDemo/ExecDash/BodyOEE?system=1&date=11-07-2012">Body OEE</a></li>
<li><a href="/mobileDemo/ExecDash/BodyDKS?system=1&date=11-07-2012">Doukie-Seisan
KPI</a></li>
<li><a href="/mobileDemo/ExecDash/BodyDT?system=1&date=11-07-2012">Down Time</a></li>
</ul>
</div>
</div>
生产日期
为系统 1 选择日期日期:选择另外值得注意的是,我正在向视图传递一个参数。URL 如下所示:
http://internal-server/mobileDemo/ExecDash/Body/1
当正在显示对话框时,这将是:
http://internal-server/mobileDemo/ExecDash/Body/1#&ui-state=dialog
什么时候在 iDevice 上不起作用(刷新之前),这是我按住按钮时显示的内容,它为我提供了在新选项卡中打开/打开选项:
http://internal-server/mobileDemo/ExecDash/Body/1#popup
我究竟做错了什么?