我尝试在弹出窗口 anchor 内使用 $.mobile.changePage 来更改到另一个页面,但是当我单击弹出窗口内的 anchor 时,页面会发生变化,然后再次返回到上一页。
我尝试了这个解决方案:changePage "jumps" back to old page 使用这个: $(文档).bind("mobileinit", function(){ $.mobile.pushStateEnabled = false; });
但它也不起作用。
这就是我构建页面的方式:
<div id="pgTest" data-role="page" data-theme="a">
@Html.Partial("_Header", new WebApp.Models.HeaderModel() { Header = "Title" })
<div data-role="ui-content">
<div style="width:90%; margin:0 auto;">
@Html.Partial("_ListViewWithFilter", Model)
<!--Pop Up-->
<div data-role="popup" id="popupConfirmacao" data-dismissible="false" data-overlay-theme="a" class="ui-corner-all">
<div role="main" class="ui-content">
<h3 class="ui-title" id="dialogTitle"></h3>
<a id="linkConfirmacaoDialog" href="#" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-btn-b" data-rel="back">Sim</a>
<a href="#" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-btn-b" data-rel="back">Não</a>
</div>
</div>
<!--Pop Up ends-->
</div>
</div>
@Html.Partial("_Footer")
</div>
这是我的 JS:
<script type="text/javascript">
$(function () {
var itens = $('#ulMusicas>li');
itens.click(function () {
var nomeMusica = $(this).find('a').text();
$('#dialogTitle').text('Add "' + nomeMusica + '"?');
$('#linkConfirmacaoDialog').click(function () {
$.mobile.changePage('/Controller2');
});
$('#popupConfirmacao').popup('open', { positionTo: 'window', transition: 'pop' });
});
});
</script>
它基本上创建了一个 ListView ,当您单击任何项目时,它将打开一个弹出窗口。如果您单击弹出窗口上的按钮,它应该将您重定向到另一个页面。此时jquery mobile将我重定向到另一个页面,然后返回到上一个页面。
有人知道可能会发生什么吗?
最佳答案
该问题是由 #linkConfirmacaoDialog
确认按钮中的 data-rel="back"
引起的。当您点击该按钮时,您会给出两个不同的导航命令。发生的情况是您导航到目标页面,然后返回历史记录。仅当您想要关闭弹出窗口并保留在同一页面时才使用data-rel="back"
。
另一个问题,popup div 不应该包裹在 page div 之外的 div 中。此外,每当单击列表项时,您都会向#linkConfirmacaoDialog
添加多个click
监听器。将 click
绑定(bind)放置在其他 click
绑定(bind)之外。
$(function () {
var itens = $('#ulMusicas>li');
/* list item click listener */
itens.click(function () {
var nomeMusica = $(this).find('a').text();
$('#dialogTitle').text('Add "' + nomeMusica + '"?');
$('#popupConfirmacao').popup('open', {
positionTo: 'window',
transition: 'pop'
});
});
/* confirmation button - popup */
$('#linkConfirmacaoDialog').click(function () {
$.mobile.changePage('/Controller2');
});
});
关于javascript - JQuery Mobile Changepage 更改页面而不是返回上一页,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27808968/