我在容器页面中有2个不同ID的页面。第一页有一个按钮,如果你点击它然后它会调用一个java脚本函数。我想实现以下一个。在java脚本函数中,条件为true,然后只使用id重定向到下一页。否则不要重定向。如何做到这一点请任何人帮助我。很清楚吗?
CODE
< !DOCTYPE html>
< html>
< head>
< meta charset="utf-8">
< meta name="viewport" content="width=device-width, initial-scale=1">
< title>Single page template</title>
< link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
< script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
< script type="text/javascript" src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
< /head>
< body>
< !-- BMR Screen page -->
< div data-role="page" id="BMR_screen">
< div data-role="header" data-theme="e" id="hdrBMRScreen">
< h1> BMR Screen< /h1>
< /div>
< div data-role="content" id="contentBMRScreen">
< div data-role="fieldcontain">
< label for="BMR_age">Age(in years):</label>
< input type="text" id="BMR_age" />
< /div>
< a href="#BMR_Result" onclick="BMR_Cal()" data-role="button">submit</a>
< /div>
< /div>
< !-- End BMR Screen -->
< div data-role="page" id="BMR_Result">
< div data-role="header" data-theme="b" >
< a data-role="button" data-rel="back" data-icon="back">back</a>
<h1>BMR Result</h1>
< /div>
< div data-role="content">
< p id="W_Range">Weight Range:</p>
< /div>
< /div>
< script type="text/javascript">
var agevar;
$(document).ready(function () {
// Initialize variables
ageVar = $('#BMR_age');
});
function BMR_Cal()
{
if(ageVar.val() > 0)
{
// then only it will redirect to the next page i.e, BMR_Result
}
}
< /script>
< /body>
< /html>
答案 0 :(得分:1)
在jQuery mobile中,您不应该使用ready事件。使用mobileinit事件,因为jQuery移动的初始代码在DOM准备好之前运行。 See
另外,请考虑使用$.mobile.changePage method在javascript中执行页面更改,因为它更安全,更易于配置。
答案 1 :(得分:0)
好的问题是你在页面加载时(在用户输入任何内容之前)分配变量。
让我们准备好在文档中弹出所有内容。
$(document).ready(function () {
// Initialize the variable by declaring it
var ageVar ;
function BMR_Cal() {
//then tie it to the input element AFTER the user has inputted .
ageVar = $('#BMR_age');
if(ageVar.val() > 0) {
document.location.href="yourpagename#BMR_Result";
}
});