我有一个非常基本的
JQuery移动应用程序.当用户单击我的“设置”按钮时,我想将它们重定向到另一个页面,提示他们输入他们的电子邮件地址.我希望两页之间有一个漂亮的“幻灯片”转换.但是,似乎需要权衡利弊.
基本上,如果我在设置按钮中有’rel =“external”’,如下所示,用户将进入下一个屏幕.但是,没有过渡.但是如果我删除’rel =“external”’,我会得到一个转换,但是,下一个屏幕的顶部会有一个小红条.这个红条显然是我的errMsg div.就像.hide代码不会被调用.
在这种情况下,我该如何调用像.hide这样的函数?我最初想要隐藏errMsg div.但我不知道如何做到这一点,同时仍然允许JQuery Mobile分配的漂亮过渡.
Home.html中
<div data-role="page"> <div data-role="header"><h1>My App</h1></div> <div data-role="content"> <div><a href="/setup" rel="external" data-role="button">Setup</a></div> </div> </div>
Setup.html
<div data-role="page"> <div data-role="header"><h1>Setup</h1></div> <div data-role="content"> <div id="errorMsg" style="background-color:red; padding:2px 0px 2px 8px; margin-bottom:6px;"></div> <label for="emailTextBox">Email Address</label> <input id="emailTextBox" type="email" /><br /> </div> </div> <script type="text/javascript"> $(document).ready(function () { $("#errorMsg").hide(); }); </script>
感谢您提供的任何帮助/见解.
解决方法
尝试更新您的setup.HTML代码,如下所示
<div data-role="page"> <div data-role="header"><h1>Setup</h1></div> <div data-role="content"> <div id="errorMsg" style="background-color:red; padding:2px 0px 2px 8px; margin-bottom:6px;"></div> <label for="emailTextBox">Email Address</label> <input id="emailTextBox" type="email" /><br /> </div> <script type="text/javascript"> $(document).ready(function () { $("#errorMsg").hide(); }); </script> </div>