【发布时间】：2018-09-18 18:42:14
【问题描述】：
我正在为我的 android 设备构建一个小型混合移动应用程序，我正在使用 jquerymobile、jquery、Ajax、PHP、MySQL 等。我是混合应用程序的新手。我已将应用程序包装在 cordova 中并安装在我的设备上。登录按钮似乎只刷新页面，但在单击或触摸时不会触发 jquery 事件。它甚至不进行表单验证。但是，这在浏览器中可以完美运行（我已经在远程服务器上上传了相同的 html 文件）。
<script>
$(document).on('click', '#btnLogin', function(e)
{
e.stopImmediatePropagation();
e.preventDefault();
FORM VALIDATION COMES HERE
AJAX COMES HERE
$.ajax(....);
});
<!--*************************************HOME PAGE BELOW**********************************-->
<div data-role="page" id="home"> <!-------------- Home page starts here ----------->
<div data-role="header" data-position="fixed" class="ui_mobile">
<h1>Grade-App 2018</h1>
</div>
<div role="main" class="ui-content">
<h1>Welcome to Grade-App!</h1>
<p> <b> Check Your Exam Results</b> </p>
<p> Existing Users</p>
<a href="#login_Page" id="login_link" class="ui-btn ui-btn-b ui-corner-all" data-transition="slide" data-ajax="false" data-prefetch="true" > Click to Sign-In</a>
</div>
<div data-role="footer" data-position="fixed" class="ui_mobile">
<h1>© 2018 Grade-App | All Rights Reserved</h1>
</div>
</div> <!-------------- Home page ends here ----------->
<!--*************************************login PAGE BELOW**********************************-->
<div data-role="page" id="login_Page"> <!-------------- Login page ----------->
<div data-role="header" data-position="fixed" class="ui_mobile">
<a href="#home" data-icon="home" data-ajax="false" data-transition="slide" data-direction="reverse" data-prefetch="true">Home</a>
<h1>Grade-App 2018</h1>
</div>
<div id="login_div" data-role="content" class="ui-content" data-theme="e"> <!-- Login content Div-->
<br><br>
<p style="color:#CC191C;">Student and Admin Staff Login</p>
<br><br>
<hr> <!--<br><br>-->
<form method="post" action="" data-ajax="false" data-transition="pop" data-direction="reverse" id="login_form" >
<!--<p id="errorMsg" class="error" style="color:#ED0E11"> </p>--> <!--This is to display validation message-->
<div class="err" id="error"></div>
<div data-role="fieldcontain">
<!--<label for="username" id="lblusername" name="lblusername"> User Name <span style="color:#ED0F13"> *</span>:</label>
<input type="text" id="username" name="username" placeholder="User Name" title="Please enter User Name" />-->
<input type="text" id="username" name="username" placeholder="User Name" title="Please enter User Name" />
</div>
<div data-role="fieldcontain">
<!--<label for="password" id="lblPassword" name="lblPassword"> Password <span style="color:#ED0F13"> *</span>:</label>-->
<input type="password" id="password" name="password" placeholder="Password" title="Please enter Password" />
</div>
<div data-role="fieldcontain">
<label for="chck_rememberme">Remember me</label>
<input type="checkbox" name="chck_rememberme" id="chck_rememberme" checked="">
</div>
<hr>
<div data-role="fieldcontain">
<input type="submit" data-ajax="false" data-role="button" data-inline="false" value="Sign-In" id="btnLogin" name="btnLogin" role="button" class="ui-btn" data-icon="check" data-iconpos="top" data-theme="e" />
<!-- <input type="submit" data-inline="true" value="Login" data-theme="b" class="ui-btn" role="button" />-->
</div>
</form>
<div data-role="footer" data-position="fixed" class="ui_mobile"><h1>© 2018 Grade-App | All Rights Reserved</h1></div>
</div> <!-- End of Login Content Div-->
</div> <!-- End of Login page-->
我在一个 HTML 文件中有多个页面并使用内部页面链接。正如我所说，代码在浏览器中运行良好。混合版本没有触发以下代码： $(document).on('click', '#btnLogin', function(e){ .... }
您知道为什么它在科尔多瓦不起作用吗？我不知道我是否遗漏了什么。
【问题讨论】：
标签： jquery cordova jquery-mobile hybrid