我需要在提交表单时将iframe重定向到不同的页面

Question

这是我的代码:当函数被调用时，我尝试了许多方法来重定向iframe到不同的页面。我需要解决这个问题，我需要知道如何在不同的页面上加载iframe当我在输入字段

中输入字母表时

function setAction(form) {
var inp = document.getElementById("oid").value;
var letters = /^flow/i;
var numbers = /^[0-9]/i;
var empty = /^(?!s*$).+/;
if (oid.value.match(letters)) {
// var page = "https://flowpl.com/track/"
form.action = "https://flowpl.com/test-page/";
// window.top.location.href = page;
// location.href = "https://flowpl.com/test-page/";
} else if (oid.value.match(numbers)) {
let url_string = "https://tracker.flowpl.com/track_customer_orders";
let refNum = document.getElementById('oid').value;
window.location.href = url_string + "?refNum=" + refNum + "&lang=english";
}
// else  {
//    // alert('Please input numeric characters only');
//    // document.test.oid.focus();
//    return false;
// }
return false;
}
function loadintoIframe(info) {
if (typeof info.id !== 'undefined' && typeof info.src !== 'undefined') {
document.getElementById(info.id).src = info.src;
}
}
window.onload = function() {
document.forms['test'].elements['submit'].onclick = function() {
// let page = "https://flowpl.com/track/";
let myIframe = document.getElementById("myiFrame");
let url_string = "https://flowpl.portal.shipsy.in/track/result";
let refNum = document.getElementById('oid').value;
let adsURL = url_string + "?refNum=" + refNum + "&searchBy=referenceNumber";
console.log(adsURL);
// let frame = window.location.href = "https://flowpl.com/track/";
// let frame = window.frames["myiFrame"].top.location = "https://flowpl.com/track/"
// window.top.location.href = page;
myIframe.src = adsURL;

}
}

<div class="container-wrap">
<div class="container main-content">
<div class="row">
<form name="test" method="POST" onsubmit="return setAction(this)">
<input type="text" name="oid" id="oid" value="" required>
<input type="submit" name="submit" value="submit">
</form>
<iframe style="border:0px #ffffff none;" name="myiFrame" id="myiFrame" scrolling="yes" frameborder="1" marginheight="0px" marginwidth="0px" height="500px" width="1200px" allowfullscreen></iframe>
</div>
<!--/row-->
</div>
<!--/container-->
</div>

Answer 1

你可以直接将target添加到表单

永远不要在表单中调用任何submit

window.addEventListener("load", function() {
document.getElementById("test").addEventListener("submit", function() {
let url_string = "https://flowpl.portal.shipsy.in/track/result";
let refNum = document.getElementById('oid').value;
let adsURL = url_string + "?refNum=" + refNum + "&searchBy=referenceNumber";
console.log(adsURL);
this.action = adsURL;
})
})

<div class="container-wrap">
<div class="container main-content">
<div class="row">
<form id="test" method="POST" target="myiFrame">
<input type="text" name="oid" id="oid" value="" required>
<input type="submit" value="submit">
</form>
<iframe style="border:0px #ffffff none;" name="myiFrame" id="myiFrame" scrolling="yes" frameborder="1" marginheight="0px" marginwidth="0px" height="500px" width="1200px" allowfullscreen></iframe>
</div>
<!--/row-->
</div>
<!--/container-->
</div>