Question

以下html代码是一个简化版本，用于演示在使用Safari的ipad或iphone上使用时的问题。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
     <head>
         <meta charset="utf-8" />
         <title>Testing</title>
         <script type="text/javascript">
                                function getstuff()
                                {
document.dataentry.tandc.blur();
<!-- Show the Continue button now -->
document.getElementById("open").hidden="";
ff.style.display='block';
                           document.dataentry.sb.focus();
}
</script>
         </head>
         <body>
<div class="span8">
<div class="row">
<div class="box">
<h3>Sign Up To Access Wi-Fi</h3>
<!-- Not going via Facebook -->
<form name="dataentry" action="http://www.cavreporter.com.au:90/Portal/DoNothing.php" method="post">
     <div class="field" align="left">
     <span><input type="text" name="fn" placeholder="Name" /></span>
     </div>
     <div class="field" align="left">
     <span>
     <input type="email" name="em" id="txtEmail" placeholder="Email Address" />
     </span>
     </div>
     <div class="field" align="left">
     <span>Subscribe: <input type="checkbox" name="sb" /></span>
     <label>
     <h5>By ticking subscribe you agree to receive information</h5>
     </label>
     <input name="tc" type="hidden" />
     <button class="button" style="text-decoration: underline;" name="tandc" type="submit" onclick="getstuff()">Sign Up</button>
     </div>
</form>
</div>
</div>
</div>
<!-- This is the "Enter" button for "Open" networks. -->
<div style="display:none;" id="ff">
<!-- This is the "Enter" button for "Open" networks. -->
<div class="span8">
<div class="row">
<div class="box">
<strong>By clicking Continue, you agree.</strong>
<form action="$authaction" method="get">
     <input name="tok" type="hidden" value="$tok" />
     <input name="redir" type="hidden" value="$redir" />
     <button class="button" style="text-decoration: underline;" id="open" hidden="hidden" type="submit">Continue</button>
</form>
</div>
</div>
</div>
</div>
</body>
</html>

代码显示几个文本字段和一个按钮，而另一个按钮目前对用户隐藏。在信息输入文本字段后，单击按钮，现在出现另一个按钮。在Safari设备上使用它时，第二个按钮按预期显示，然后几乎立即使用动作语句中php例程的地址加载新页面。使用其他浏览器时，页面未加载，按钮按预期显示。

我只是滥用HTML标准，或者Safari需要更多内容，因为我不希望它加载页面。

www.cavreporter.com.au:90/fu.html

提供了一个例子

Answer 1

因为您的按钮有type="submit"所以表单正在发布。

所以你可以像这样简单地改变你的按钮：

<button class="button" style="text-decoration: underline;" name="tandc" type="button">Sign Up</button>

type="button"代替type="submit"

在第一个submit上抓住form事件以防止偶然提交也是一种不错的形式。

Safari的网页行为有所不同

1 个答案: