简体   繁体   English

jQuery Mobile中页面更改的问题?

[英]issue with page change in jquery mobile?

I am unable to change page with onClick event I am getting the following error, "uncaught typeerror cannot call method 'page change' of undefined", I am able to see alerts so control is going to mobileapp.js but page is not loading? 我无法使用onClick事件更改页面,但出现以下错误,“未捕获的typeerror无法调用未定义的方法'页面更改'”,我能够看到警报,因此控件将转到mobileapp.js,但页面未加载? Why ? 为什么呢 Control is not going to smsPage and savedList page 控件不会转到smsPage和savedList页面

This is my HTML code: 这是我的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>

My Java script and Js code is 我的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>

Code for mobileapp.js 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);        
}

You can use a tags for change page. 您可以将标签用于更改页面。 It is not necessary to use input buttons. 不需要使用输入按钮。 For example 例如

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

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM