JQuery Mobile:按钮区域不完全可点击,只剩下部分按钮触发动作

时间:2013-04-07 06:33:41

标签: jquery forms mobile button

我有一个带有几个按钮的表单,我使用第一个div来使表单更宽(宽度:330px) - 显然所有内容都调整到这个宽度但是可点击的区域:

<div data-role="popup" id="popupLogin" data-theme="a" class="ui-corner-all" style="width:330px">
    <a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Abbrechen</a>
<form id="navigation" name="navigation" onsubmit="return startNav()">
    <div style="padding:15px 20px;">
    <h3 class="h2">Ziel dieser Fahrt:</h3>
    <input type="hidden" name="action" id="action" />
    <label for="un" class="ui-hidden-accessible">Stra&szlig;e (Ziel):</label>
    <input name="strasse" id="strasse" value="" placeholder="Stra&szlig;e, Gesch&auml;ft, Einrichtung" data-theme="c" type="text">
    <label for="pw" class="ui-hidden-accessible">Stadt (Ziel):</label>
    <input name="stadt" id="stadt" value="" placeholder="Stadt oder Ortsbezeichnung" data-theme="c" type="text">
    <button type="submit" id="homenav" name="homenav" value="home" data-theme="a" data-icon="myapp-homenav" data-role="button">nach Hause</button>
    <button type="submit" id="worknav" name="worknav" value="work" data-theme="a" data-icon="myapp-worknav" data-role="button">zur Arbeit</button>
    <button type="submit" id="navnav" name="navnav" data-theme="a" value="input" data-icon="myapp-navnav" data-role="button">Navigation starten</button>
</div>
  </form>
</div>

表单渲染正常,但按钮不会触发全长的click事件。单击右侧部分,该按钮会提交但不提交表单。

实际上,点击它只显示从左边框延伸到按钮约70%的部分。点击此区域即可提交表单。

Buttons submit area not stretching button width http://oi49.tinypic.com/214qoec.jpg

图片:http://oi49.tinypic.com/214qoec.jpg

0 个答案:

没有答案