0
我在尝试让我的HTML表单在iOS设备上正常工作时遇到问题。输入元素下的“必需”属性在任何桌面Web浏览器上都能正常工作，但在移动iOS Safari上无法正常工作。问题是，我可以在移动设备上点击“提交”，即使没有任何内容，它也会“提交”。<input required>属性在iOS设备上不起作用
在这方面的帮助将不胜感激。
以下是HTML表单代码在它的整体（不CSS）的全部东西可以在http://www.calvarybaptistelkhart.org/test/contact/contact.html
<form action="GOOGLE-SPREADSHEET-RESPONSE" method="post" target="hidden_iframe" onsubmit="submitted=true;">
<h1>Contact Form</h1>
<hr>
<ol style="padding-left: 5px">
<div class="name-email">
<div class="name">
<div dir="ltr" class="">
<div class="">
<label aria-hidden="true" class="" for="entry_516852872">
<div class="">Full Name
<label for="itemView.getDomIdToLabel()" aria-label="(Required field)"></label>
<span class="astricks">*</span></div>
<div class="" dir="ltr"></div>
</label>
<input required type="text" name="entry.516852872" value="" class="" id="entry_516852872" dir="auto" aria-label="Full Name " aria-required="true" title="Please enter your full name">
<div class=""></div>
</div>
</div>
</div>
<br>
<div class="email">
<div dir="ltr" class="">
<div class="">
<label aria-hidden="true" class="" for="entry_1989288897">
<div class="">Email Address
<label for="itemView.getDomIdToLabel()" aria-label="(Required field)"></label>
<span class="astricks">*</span></div>
<div class="" dir="ltr"></div>
</label>
<input required type="email" name="entry.1989288897" value="" class="" id="entry_1989288897" dir="auto" aria-label="Email Address Please enter a valid email address" aria-required="true" title="Please enter a valid email address">
</div>
</div>
</div>
</div>
<br>
<div class="subject">
<div dir="ltr" class="">
<div class="">
<label aria-hidden="true" class="" for="entry_686432534">
<div class="subject">
<label for="itemView.getDomIdToLabel()" aria-label="(Required field)"></label>
<span class="astricks"><p></p></></span></div>
<div class="" dir="ltr"></div>
</label>
<ul class="" role="radiogroup" aria-label="Subject ">
<li class="">
<label><span class="qField">
<input required type="radio" name="entry.1726780033" value="Question" id="group_1726780033_1" role="radio" class="" aria-label="Question">
</span> <span class="subjectQuestion">Question</span> </label>
</li>
<li class="">
<label><span class="cField">
<input required type="radio" name="entry.1726780033" value="Comment" id="group_1726780033_2" role="radio" class="" aria-label="Comment">
</span> <span class="subjectComment">Comment</span> </label>
</li>
<li class="">
<label><span class="bField">
<input required type="radio" name="entry.1726780033" value="Bug Report" id="group_1726780033_3" role="radio" class="" aria-label="Bug report">
</span> <span class="subjectBug">Bug report</span> </label>
</li>
</ul>
</div>
</div>
</div>
<br>
<br>
<div class="message">
<div dir="ltr" class="">
<div class="">
<label aria-hidden="true" class="" for="entry_943921138">
<div class="">Your Message:
<label for="itemView.getDomIdToLabel()" aria-label="(Required field)"></label>
<span class="astricks">*</span></div>
<div class="" dir="ltr"></div>
</label>
<textarea required name="entry.943921138" rows="8" cols="0" class="" id="entry_943921138" dir="auto" aria-label="Your Message: " aria-required="true"></textarea>
<div class=""></div>
</div>
</div>
</div>
<input type="hidden" name="draftResponse" value="[,,"1157424860243765947"]
">
<input type="hidden" name="pageHistory" value="0">
<input type="hidden" name="fbzx" value="1157424860243765947">
<div class="submit">
<table id="navigation-table">
<tbody>
<tr>
<td class="" id="navigation-buttons" dir="ltr"><input type="submit" name="submit" value="Submit" id="ss-submit"></td>
</tr>
</tbody>
</table>
</div>
</ol>
</form>
欢迎来到跨浏览器兼容性的世界。唯一可行的方法就是在提交表单之前在JavaScript中执行检查。您可以使用像Modernizr这样的产品来检查您的浏览器是否支持某些功能，并且仅在需要时才使用Javascript代码。在任何情况下，你的服务器也应该被验证，因为没有任何东西来自浏览器是值得信任的。 FWIW你只需要包含'required'关键字。使用'required =“true”'或类似是不必要的，并且_might_可能导致兼容性问题。 – 2014-01-10 00:17:39
对于iOS，您必须使用Javascript进行验证。在提交时调用一个函数，检查每个输入的值，并且只有当输入是'！='''（或者你定义的长度）直接指向'action'中的链接。 – FlyingLemon
好的，我已将'required ='true''的值更改为'required'。我仍然有与移动设备提交表单相同的问题，而不需要其他输入。我对JavaScript并不熟悉，也不知道适当的语法是什么。任何人都可能在这里发布？谢谢！ – bvanderwerf