jquery mobile中的页面更改问题?

时间:2014-04-01 06:54:52

标签: javascript android jquery jquery-mobile

我无法使用onClick事件更改页面我收到以下错误, "未被捕获的类型错误无法调用方法'页面更改'未定义",我能够看到警报,所以控制将移动到mobileapp.js,但页面没有加载?为什么?控制不会转到smsPage和savedList页面

这是我的HTML代码:

<body>

<!-- Home page..-->
<div data-role="page" id="homePage">
         <div data-role="header" data-theme="b">
            <h1>
              Gps Coordinates
            </h1>
         </div>

 <div data-role="content">
<div id="demo" STYLE="font-family: verdana;  color: black">
 <p>Searching for GPS..</p>
</div>
<div id="location" STYLE="font-family: verdana;  color: black">
<p>Searching for Location Name</p>
</div>
<br></br>
<input id="SMS" type="submit" onClick='goToSms()' data-theme="b" value="Send SMS" data-mini="false">
<input id="EMAIL" type="submit" onClick='gomail()' data-theme="b" value="Send E-mail"  data-mini="false">
<input id="save" type="submit" onClick='showList()' data-theme="b" value="Save"  data-mini="false">
<div id="MailLatlongs" style="display: none">
<p>Searching for GPS..</p>
</div>
</div>
</div>


<!-- Sms page..-->
<div data-role="page" id="smsPage">
 <div data-theme="b" data-role="header">
            <h4>
               Send SMS
            </h4>
 </div>
         <div data-role="content">
            <div data-role="fieldcontain">
               <input name="" id="numberTxt" placeholder="Enter mobile number" value=""  type="tel" data-mini="true"><br>
               <textarea name="" id="messageTxt" placeholder="Enter message" data-mini="false" ></textarea>
                <br>
               <input id="btnDefaultSMS" type="submit" data-theme="b" value="Send SMS" data-mini="false">
            </div>
         </div>        
</div>


<!-- viewDBList page..-->
<div data-role="page" id="savedList">
 <div data-theme="b" data-role="header">
            <h4>
              Save Location
            </h4>
 </div>
         <div data-role="content">
            <div data-role="fieldcontain">
             <input name="" id="defendLatlongs" value=""  type="text" data-mini="true"><br>
             <input name="" id="defendLocation" placeholder="Enter Location name" value=""  type="text" data-mini="true"><br>
             <label for="select-choice-1" class="select">Choose category</label>
             <select name="select-choice-1" id="select-choice-1">
                 <option value="standard">Select category</option>
             </select>
             <input name="" id="defendCategory" placeholder="Enter category name" value=""  type="text" data-mini="true"><br>
         </div>        
        </div>
 </div>

</body>

我的Java脚本和Js代码是

<script type="text/javascript" src="static/mobileapp.js"></script>
<script type="text/javascript">    
 function goToSms()
       {
       alert("sms");
        selectSMS();
       }
       // Redirect to list Page
       function showList()
       {
       alert("save page");
       selectList();

       }
</script>

mobileapp.js代码

function selectOrganisation()
{
        $.mobile.changePage('#homePage', "slide", false, true);        
}
function selectSMS()
{
alert("test1");
        $.mobile.changePage('#smsPage', "slide", false, true);        
}
function selectList()
{
alert("test2");
        $.mobile.changePage('#savedList', "slide", false, true);        
}

1 个答案:

答案 0 :(得分:1)

您可以使用标签进行更改页面。没有必要使用输入按钮。例如

<a href="#homePage" class="nav-buttons next" data-transition="slide"></a>