我有许多使用相同模板的页面。如您所知，当从一个页面导航到另一个页面时，jquery mobile 只会拉入下一页的正文。
<!-- Page starts here -->
<div data-role="page" class="ui-page">
<div data-role="content" class="ui-content" role="main">
<!-- Content Start -->
@RenderBody()
<!-- Content End -->
</div><!-- contentMain -->
</div> <!-- page1 -->
<!-- Page ends here -->
在此模板的开头，我引用了一个脚本文件：
<script src="@Url.Content("~/Scripts/Apps.js")" type="text/javascript"></script>
在此，我有许多功能来检测每个页面的页面显示并在其中注册功能。
$('#Page1').live('pageshow', function (event, ui) {
$('#clear').click(function () {
//Doesn't Work when transitioning between pages - If I refresh or hit this url directly this works
var word = document.getElementById("word").value;
//Doesn't Work when transitioning between pages - If I refresh or hit this url directly this works
var word2 = $('#word').val();
});
});
我的问题是，当我尝试在页面转换后通过 getElementById 或 val() 获取元素时，它总是以未定义的形式返回。虽然如果我刷新页面或直接点击 url 它工作正常，但如果我从我的应用程序中的另一个页面开始（即使它们都使用相同的模板）并尝试导航到另一个它似乎所有的范围都不同，我不确定如何在页面显示后获取页面上的元素？
虽然这似乎有效：
alert($("#word").val()); $("#word").val("foobar"); alert($("#word").val());
如果在按钮上尝试类似下面的操作，它不会隐藏页面转换上的按钮，但是当我直接刷新页面时会隐藏？
$('#Page1').live('pageshow', function (event, ui) {
$('#stop').closest('.ui-btn').hide();
输入：
<input type="button" id="stop" value="Stop" data-theme="e" data-inline="true" class="ui-btn-hidden">