如何阻止漫游器使用.submit（）绕过我的“必填”字段？

Question

I have a form which is producing a lot of spam. I have made all inputs required and have attached a captcha. This has not had any affect.

I assume the bots are using form.submit() as for some reason this bypasses all my required fields AND also bypasses my onsubmit="check(e)"

I cannot seem to grab this event .submit() by any means. Does anyone know how to catch this event and make sure it is cancelled. I want the only way to submit the form is through clicking the submit button.

$("#myForm").submit(function(event) {
    console.log("Handler for .submit() called.");

    if (CaptchaInput.value == "") {
        event.preventDefault();
    }
});

My code that was supposed to catch a .submit() call and prevent the form submission. This function is never triggered.

<form target="hidden_iframe" 
onsubmit="if (CaptchaInput.value == '') { why += '- Please Enter CAPTCHA Code.\n'; alert(why); return false; };return checkform(this)" id="myForm">

Answer 1

You cannot. I can submit your form without a browser, or with JavaScript disabled. Anyone can just send an HTTP POST request to your server, without going through any client-side process you may introduce.

The solution to your problem is to also verify on the server , and don't rely on the client side validation to have completed successfully (or indeed, even to have been run at all).

Treat client-side validation as a convenience to your users, they see the error immediately without having to retype and resubmit the entire form.

Answer 2

You can define the onsubmit attribute of the form, to run a function that validates your input. The browser will submit the form only if that function returns true.

UPDATE: You can define the action only after the form has been validated.

So, your html will look something like this:

<form id="myForm" onsubmit="return checkRecaptcha()" action="disabled">
<input type="text" name="myTextInput" value="">
<input type="submit" value="Submit">
</form>

And your javascript code, that defines the function will look like this:

function checkRecaptcha() {
  if (CaptchaInput.value == "") {
    document.getElementById("myForm").action="myCorrectUrl";
    return true;
  } else {
    alert("not allowed");
    return false;
  }
}

Then for catching the submit function:

document.getElementById("myForm").submit = function () {
  console.log("catched");
  return false;
}