表单提交上的Jquery移动加载图标

时间:2014-02-12 16:13:36

标签: javascript jquery jquery-mobile

像往常一样,我正在努力使用jquery mobile ......

我有一张表格:

<form data-role="none" action='cart_checkout.php' METHOD='POST' data-ajax="false">
  <input type="hidden" name="itemname" value="test" />
  <input type="hidden" name="itemdesc" value="test" />
  <input type="hidden" name="itemnumber" value="f1" />
  <input type="hidden" name="custom" value="teste" />
  <input type="hidden" name="itemprice" value="99.00" />
  <input type="hidden" name="itemQty" value="1" />
  <input type="hidden" name="useraction" value="commit" />
  <input data-role="none" onclick="$.mobile.showLoadingMsg();" type="image" name="submit" src="images/checkout.png" border="0" align="top" alt="Check out with PayPal"/>
</form>

我想在用户点击提交时显示加载图标。 我尝试了很多例子,但没有显示加载图标。

我的标题如下:

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.1/jquery.mobile-1.2.1.min.css" />
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.1/jquery.mobile-1.2.1.min.js"></script>

这里有什么问题?

1 个答案:

答案 0 :(得分:0)

我用这个解决了我的问题:

<form data-role="none" action='cart_checkout.php' METHOD='POST' data-ajax="false">
<input type="hidden" name="itemname" value="test" />
<input type="hidden" name="itemdesc" value="test" />
<input type="hidden" name="itemnumber" value="f1" />
<input type="hidden" name="custom" value="teste" />
<input type="hidden" name="itemprice" value="99.00" />
<input type="hidden" name="itemQty" value="1" />
<input type="hidden" name="useraction" value="commit" />
<input data-role="none" id="go" onclick="$('#loading').show(); $('#go').hide()" type="image" name="submit" src="images/checkout.png" border="0" align="top" alt="Check out with PayPal"/>
</form>
<div id="loading" style="display:none;">
<p align=center"> Redirecting </p>
<img src="loading.gif" alt="" /></div>