Question

我目前正在将jQTouch web项目移植到jQuery Mobile并遇到以下问题：我需要在页眉中显示一个表单提交按钮，但除非我在提交按钮中执行标题中的操作（而是在内容中提交类型的输入）jQuery Mobile将始终将该按钮呈现为表单的一部分。

这将有效（按钮将显示在页面标题的右侧）：

<div data-role="header" data-theme="b">
     <a href="#" class="ui-btn-right" data-icon="check"><%: Resources.View.Account.Labels.DoLogOn %></a>
</div>

事情是，我必须编写自定义的javascript来触发提交，这显然我不愿意。另一方面，如果我在表格中处理这个问题，即

<% using (Html.BeginForm("LogOn", "Account", 
     new { returnUrl = Request.QueryString["ReturnUrl"] }, FormMethod.Post,         
     new { @class = "ui-body ui-body-c" }))
   {%>
      <fieldset class="ui-grid-a" data-theme="c">
         <input data-icon="check"
                class="ui-btn-right"
                type="submit" 
                value="<%= Resources.View.Account.Labels.DoLogOn %>" />
      </fieldset>
<% } %>

按钮将显示在内容中。

有没有办法让jQuery Mobile使用后一种方法在标题中显示提交按钮？

Answer 1

我对jQTouch不熟悉，但是如下所示呢？问题可能出在所使用的css类和使用它们的地方。

<% using (Html.BeginForm("LogOn", "Account", 
     new { returnUrl = Request.QueryString["ReturnUrl"] }, FormMethod.Post))
   {%>
   <div data-role="header" data-theme="b">
     <fieldset class="ui-grid-a" data-theme="c">
     <input data-icon="check"
            class="ui-btn-right"
            type="submit" 
            value="<%= Resources.View.Account.Labels.DoLogOn %>" />
     </fieldset>
   </div>
   <div id="Content" class="ui-body ui-body-c">
      ...content here
   </div>
<% } %>

Answer 2

我知道我已经迟到了几个月，但我发现这篇文章研究了另一个问题。要从标题中的按钮提交页面，您可以使用以下按钮标记：

<a href="#" onclick="$('form#Account').trigger('submit')" class = "ui-btn-right" data-role="button" >Logon</a>

在标题中显示提交按钮

2 个答案: