<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>TTT</title>
</head>
<body>
<form id="f" method="get">
<input type="text" placeholder="A">
<button type="submit">B</button>
</form>
<script>
document.getElementById("f").onsubmit = function (e) {
console.log(e);
const xhr = new XMLHttpRequest();
xhr.open("get", "", true);
xhr.send();
};
</script>
</body>
</html> the short code above, click the button, and the submission event is expected to be printed in console , and then the page is not refreshed. As a result, TM refreshes the whole page every time you click the button-
add return false to the end of the onsubmit function to submit asynchronously without refreshing the page.
but
however, I"m pretty sure I"ve never used return false in my previous asynchronous commit. I don"t know why it suddenly didn"t work this time. Is there a big god who can answer it?
attach the code that is still successful without return false before-
function post_tab() {
//
document.getElementById("work_form").onsubmit = function (e) {
e.preventDefault();
const xhr = new XMLHttpRequest(),
f = e.target,
formData = new FormData(f),
log = $("-sharpprint_log");
xhr.open("POST", f.action, true);
xhr.responseType = "json";
xhr.onreadystatechange = function () {
if(xhr.readyState === 4 && xhr.status === 200){
const data = xhr.response;
console.log(data);
print_tab(data["qrs"], log[0]);
log.scrollTop(log[0].scrollHeight - log.height());
input_clean("input_qr");
}
};
xhr.send(formData);
}
} this function post_tab use onclick to bind to the submit button-
<button class="btn btn-success form-control" onclick="post_tab()"></button>