提交时未重定向Javascript表单



我的表单正在调用以下函数。它在桌面上工作,用户被引导到下载确认/失败页面。

然而,在移动设备上(在iOS和iPad上测试(,用户不会被重定向。有人能透露一些信息吗?

功能

function submit_form()
{
var email = document.getElementById("main-email-field").value
// todo email validation
if (email.length > 7)
{
window.location = '/download-confirmation'
}
else
{
window.location = '/download-failed'
}
return false;
}

表单

<form id="main-email-form" class="email-form" method="POST" onsubmit="submit_form()" action="https://europe-west1-hoddle-website.cloudfunctions.net/registerUser" target="hiddenFrame">
<input id="main-email-field" class="main-email-field" type="email" name="email" placeholder="Email address">
<button id="main-email-button" class="main-email-button">Download</button>
<input type="hidden" id="main-referralID-field" name="referralID" value="">
<input type="hidden" id="main-referralType-field" name="referralType" value="">
<input type="hidden" id="main-referralUserID-field" name="referralUserID" value="">
</form>

<iframe id="hiddenFrame" class="hiddenFrame" name="hiddenFrame" width="0" height="0" border="0" style="display: none;"></iframe>

尝试这种超时和preventDefault 的组合

window.addEventListener("load", function() {
document.getElementById("main-email-form").addEventListener("submit", function(e) {
const email = document.getElementById("main-email-field").value
// todo email validation
console.log(email,email.length); 
if (email.length > 7) {
setTimeout(function() {
console.log("Download allowed");
// window.location = '/download-confirmation'; // uncomment after testing
}, 2000)
} else {
e.preventDefault(); // stop submission
console.log("Download failed");
// window.location = '/download-failed'; // uncomment after testing
}
})
})
<form id="main-email-form" class="email-form" method="POST" action="https://europe-west1-hoddle-website.cloudfunctions.net/registerUser" target="hiddenFrame">
<input id="main-email-field" class="main-email-field" type="email" name="email" placeholder="Email address">
<button type="submit" id="main-email-button" class="main-email-button">Download</button>
<input type="hidden" id="main-referralID-field" name="referralID" value="">
<input type="hidden" id="main-referralType-field" name="referralType" value="">
<input type="hidden" id="main-referralUserID-field" name="referralUserID" value="">
</form>
<iframe id="hiddenFrame" class="hiddenFrame" name="hiddenFrame" width="0" height="0" border="0" style="display: none;"></iframe>

最新更新